Vue.js笔记(一)

Vue.js引入方法

• CDN引入
• 下载vue.js

Vue.js的使用

1.创建Vue对象 new Vue({})

2.属性

• el:element 需要获取的元素，一定是html的根容器元素
• data:用于数据的存储
• methods:用于存储各种方法

3.在使用数据的地方使用{{ data的属性名}}或{{methods中方法名()}}

4.代码示例
js代码：

new Vue({
	el:"#vue-app",
	data:{
		name:"andy"，
		job:"java Web开发"
	},
	methods:{
	     greet:function(time){
	        return 'Good '+time+'!';
	    }
	}
});

html代码：

	
	
	
	


	

		
{{greet('afternoon')}}
		
Name:{{ name}}
		
job:{{job}}
	
	

4.数据绑定
v-bind:属性=Vue属性
如：

• v-bind:href=""
• v-bind:value="
• v-html=""

5.事件绑定
v-on:事件名="方法名"
@事件名="方法名"
如：

• on:click="add()"
• 列表项