更新一下笔记，关于vue

基础语法

1、data 数据

每一个组件都有一个 data 属性，用来保存当前组件所有需要用到的数据。

export default {
    data() {
        return {
            // 数据
            name: "张三",
            age: 20
        };
    },
};

Vue 会将 data 中的数据加入到“响应式系统”中，当数据发生变化时，页面就会自动更新。

2、模板语法

Vue 中提供了 { {}} 语法来实现数据动态渲染。

<h1>我叫{
 {name}}，今年{
 {age + 1}}岁</h1>

{ {}} 中可以用来渲染所有的 JS 表达式。

3、事件绑定

Vue 中在标签身上提供了 v-on 来绑定事件：

<button v-on:click="name = '张三'">按钮</button>

3.1 v-model

v-model 指令在表单元素上创建双向数据绑定。负责监听用户输入事件。 例:当input中的值改变，p标签中的值也会改变。

<input type="text" v-model='msg'>
    <p>{
 {msg}}</p>
​
data(){
    return{
        msg:'值'
​
        }
    }

4、ref 属性（扩展