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()"
• 列表项