vue基础语法一

一、绑定数据

1、语法
<template>
<div >
 <!--HTML获取绑定数据  -->
<h1>{{ msg }}</h1>
<h1>name :{{user.name}},age:{{user.age}}</h1>
<ul>
<li v-for="item in list">
   {{item.name}}
   </li>
</ul>
</div>
</template>
    <script>
//数据格式
export default {
     name: 'app',
     data () {
     return {
   msg: 'Welcome to Your Vue.js App'
   ,user:{name:"jj",age:12}
   ,list:[{name:'ssdd'},{name:'llldd'}]
   }
   }
}
</script>注意循环数组时,需使用v-for,通过item参数循环获取数组值
<script>
export default {
  name: 'app',
   data () { //数据
   return {
    vuetitle: 'Welcome to Your Vue.js App'
,url:"http://www.baidu.com"
      }
    }


}


</script>


三、绑定HTML标签


通过data中的参数值,绑定对应的html标签


<div v-html="h">


<script>
export default {
  name: 'app',
   data () { //数据
   return {
    vuetitle: '<h>我是一个H标签<h/>'
      }
    }


}


</script>