-
<style scoped> 作用域修饰符
查看全部 -
this.list.splice(index,1)
查看全部 -
父子组件 传值
查看全部 -
外部传递内容 内部接收 用 :content（） 内部接收用 props：【‘content’】
查看全部 -
全局组件
Vue.component('zujianming',{
template：“<li></li>”
})
查看全部 -
v-if v-show v- for
v-for=“（item,index） of list” :key="index"
查看全部 -
computed 计算属性
computed:{
fullname： function（）{
return this.fristname + this .lastname
}
}
2. watch 监听器属性 监听某个项发生改变
查看全部 -
v-bind 可简写成 ：
v-model 数据的双向绑定指令
查看全部 -
v-text 将文本全部输出 会进行一次转义
v-html 将文本作为html语法进行输出 不会进行转义。
v-on:click 绑定点击事件 可简写成 @click
<script> new Vue({ el:"#guazai", // template:"<h1>hell word {{msg}}</h1>", data:{ msg:"hell" }, methods: { handClick: function() { this.msg = "word" } } }); </script>查看全部 -
<!DOCTYPE html>
<html>
<head>
<title></title>
<script src="./vue.js"></script>
</head>
<body>
<div id="root">
<div>
<input v-model="inputValue" />
<button @click="handleClick">提交</button>
</div>
<ul>
<li v-for="(item,index) of list" :key="index">{{item}}</li>
</ul>
</div>
<script type="text/javascript">
new Vue({
el:"#root",
data:{
inputValue:'hello',
list:[]
},
methods:{
handleClick:function(){
this.list.push(this.inputValue);
this.inputValue='';
}
}
})
</script>
</body>
</html>
查看全部 -
v-model 双向绑定
查看全部 -
v-bind： 直接用：代替
查看全部 -
title 鼠标放置显示信息
v-bind 属性值与数据项绑定
查看全部 -
使用v-text
查看全部 -
v-on 绑定事件简写为@
v-on:click == @click
查看全部
举报