47 lines
1.0 KiB
Markdown
47 lines
1.0 KiB
Markdown
Vue是一个用于构建用户界面的渐进式框架
|
||
|
||
## 插值表达式
|
||
|
||
```
|
||
可以被求值的代码，JS引擎会将其计算出一个结果
|
||
<div>
|
||
{{ message }}
|
||
</div>
|
||
```
|
||
|
||
## VUE指令
|
||
|
||
```
|
||
v-html: "表达式"
|
||
设置元素的innerHTML
|
||
|
||
v-show： "true/false"
|
||
控制元素显示隐藏，通过display:none 控制显示隐藏
|
||
|
||
v-if: "表达式"
|
||
控制元素显示/隐藏，通过是否创建/移除元素节点方式实现，适用于不频繁切换场景
|
||
|
||
v-else v-else-if
|
||
辅助v-if判断渲染，紧挨着v-if使用
|
||
|
||
v-on: 事件名="methods中的函数名"
|
||
注册事件 = 添加监听 + 提供逻辑处理
|
||
可简写成@事件名="函数/表达式"
|
||
|
||
v-bind:
|
||
动态设置html的标签属性，如src url title class等
|
||
:属性名="表达式"
|
||
|
||
v-for="(item,index) in 数组"
|
||
基于数据循环，多次渲染整个元素
|
||
|
||
v-model='变量'
|
||
给表单元素（通常写在input中）使用，双向数据绑定
|
||
输入框：value
|
||
复选框：ckecked
|
||
单选框： 绑定value
|
||
下拉菜单：绑定value
|
||
|
||
v-bind：
|
||
```
|