Vue.js基础

1. 基础结构

   var app=new Vue({
   	el:"#myapp",
   	//数据
   	data:{
   		tilte:"vue.js",
   		name:"python"
   	},
   	//函数
   	methods:{ 
   		show:function(){
   		
   		}
   	}
   })
   

2. 条件和循环

   v-if="true" //为true时显示，false时隐藏
   v-for="job in jobs" //循环
   

3. 用户交互

   v-on:click=""  //绑定方法，简写@click=""
   v-model=""   //可以为input框赋value值，双向响应
   v-text=""   //设置文本
   v-html=""  //可以放html语句
   v-bind:attr=""  //绑定属性，简写:attr=""
   

4. 生命周期钩子

   beforeCreate:实例被创建前
   created：实例创建时
   mounted：页面加载
   updated：有修改时
   destroyed：实例销毁时
   

5. 组件

   //job-item：组件名
   //templete：组件内容
   //props：参数
   Vue.component('job-item',{
           props:['list'],
           template:`<ul>
               <li v-for="item in list" :id="item.id" v-text="item.title">
   
               </li>
               </ul>`
       })