这是sylu计算机协会的第一次技术征文活动
vue写法
插入式, 你好,{{name}}
new Vue({
el:"#xxx"
data:{
name:"xxx"
}
})
v-model双向绑定,且只能应用在表单类元素(输入类元素中,即为得有value值{input,单选框,多选框,多行输入}) v-bind单向绑定,数据从data流向页面
el和data的写法
el和$mount("XXX")都可指定容器
setTimeout(()=>{
v.$mount("XXX")
},1000)
data的第二种写法
data:function(){
return{
}
}
PS:v-on:click = "XXX" :事件被点击 @click="XXX"
事件修饰符
Vue中的事件修饰符:
1.prevent:阻止默认事件(常用):
2.stop:阻止事件日泡(常用):
3.once:事件只触发一次(常用):
4.capture:使用事件的插获模式:
5,self:只有event.target是当前操作的元素是才触发事件:
6,passive:事件的默认行为立即执行,无需等待事件回调执行完中:
vue里常见的监听方式
1.@click.prevent = "XXX" 捕获阶段由外往内,之后触发冒泡阶段,由内到外
2.@scroll = "xxx"给滚动条加事件
3.@wheel= "wheel"给滚动轮增加事件
给ul加overflow:auto可以增加滚动条
键盘监听事件
@keyup(按下按钮松开) @keydown(按下按钮未松开) e.target.value:target 事件属性可返回事件的目标节点 1.Vue中常用的按键别名:
回车=>enter
删除=>delete(插获“除”和“退格”健)
退出=>esc
空格=>space
换行=>tab
上=>up
下=>down
左=>left
右=>right
2.Vue未提供别名的按健,可以使用按健原好的key值去监听,但注意要转为kebab-case(短横线命名)
3.系统修饰健(用法特殊):ctrl、alt、shift、meta (1),配合keyup使用:按下修饰健的同时,再按下其他健,随后释放其他健,事件才被触发。
(2).合keydown使用:正常触发事件.
4,也可以使用keyCode去指定具体的按健(不推荐)
5,Vue.config.keyCodes.自定义健名 = 健码,可以去定制按键别名
注:tab键绑定用keydown
事件的基本使用:
1,使用v-on:xxx或exxx绑定事件,其中xxx是事件名: 2.事件的问调需要配置在nethods对象中,最终会在vm上 3.methods中配置的函数,不要用箭头函数!否则th1s就不是vm了: 4,methods中配置的函数,都是被Vue所管理的函数,this的指向是vm或组件实例对象: 5.Oclick="deno”和Cc1ick="demo(Sevent)"效果一致,但后者可以传参:
计算属性
计算属性与监视
正则表达,slice(0,3)截取前三位
@click = "XXX()"加括号可以传event以外的值,需要传参数就加括号,不需要则不加
直接都加小括号比较"无脑"
箭头函数在ES6中学习
当fullname被修改时要用set
箭头函数时的this不是vm而是window
读取的get 修改的set 有 ! 取反
监视属性
watch:{
XXX.handler(){
}
}
XXX不加引号的前提是属性名必须满足变量取名的要求,变量取名时不能有 . 和【】