这里记录一些学习Vue.js的注意项。
一.动态参数实例
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>demo</title>
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
</head>
<body>
<div id="app">
<p v-bind:[titleTest]="msg">鼠标标签</p>
<a v-on:[clicktest]="doSomething"> 点击我试试 </a>
</div>
<script>
//注意!!!!clicktest这种动态参数在Vue的script里面必须为小写
var vm=new Vue({
el:"#app",
//注意!!!!变量需要用引号
data:{
msg:"看到我了吧",
titletest:"title",
clicktest:"click"
},
methods:{
doSomething:function(){
alert("hi");
}
}
})
</script>
</body>
</html>
特别注意:
<p v-bind:[titleTest]="msg">鼠标标签</p>
<a v-on:[clicktest]="doSomething"> 点击我试试 </a>
(1).像上面这2种动态参数名字[titleTest和clicktest]可以取任何字母和数字,这里不区分大小写,但是不能加特殊符号。
data:{
msg:"看到我了吧",
titletest:"title",
clicktest:"click"
},
(2).使用这2种动态参数[titletest和clicktest]的时候在data中必须有定义,而且这里必须为小写!
附上官网:
Vue.js-动态参数