• 条件渲染

<script>const app = Vue.createApp({data(){return {show:true,conditionOne: false,conditionTwo: true,}},template:`<div v-if="show">  hello word  </div><div v-if="conditionOne">  if  </div><div v-else-if="conditionTwo"> else if  </div><div v-else>  else  </div>`});// vm 代表的就是 vue 应用的根组件const vm = app.mount('#root');</script>

2. 列表循环渲染

<script>const app = Vue.createApp({data(){return {listArray:['dell', 'lee', 'teacher'],}},template:`<div> <div v-for="(item, index) in listArray" :key="item">{{item}} -- {{index}}</div></div>`});// vm 代表的就是 vue 应用的根组件const vm = app.mount('#root');</script>

3. 事件绑定