• Vue小笔记


    官网中文手册

    常用命令

    vue标签大杂烩

    • v-if:条件渲染
    • v-else: 如果为 false, 当前标签才会输出到页面
    • v-show : 通过控制 display 样式来控制显示/隐藏
    • v-for: 列表渲染
    • v-on: 事件监听。
      • v-on:= @。事件修饰符:
      • 鼠标事件:.stop、.prevent、.self、.capture、.once、.passive
      • 键盘事件:.enter、.tab、.delete (捕获“Delete”和“Backspace”两个按键)、.esc、.space、.up、.down、.left、.right
    • v-bind: 单行绑定,会当成vue.js来执行。
      • v-bind: = :。v-bind:href=“newHref” == :href=“newHref”
    • v-model: 表单类元素绑定,得有默认的value值,双向数据绑定
    • v-text : 更新元素的 textContent
    • v-html : 更新元素的 innerHTML
    • v-cloak : 防止闪现, 与 css 配合: [v-cloak] { display: none }
    • onMounted():生命周期钩子函数
    • watch():异步监听函数
    • watchEffect()
    • ref: 模版引用

    散碎知识点

    • reactive():函数接收一个复杂数据类型的数据(对象或数组)作为参数,并返回一个响应式代理对象。(响应式数据即当数据发生变化时 UI 也会自动更新)
    • ref():函数接收一个基本数据类型的参数同时返回一个基于该值的响应性对象,该对象内部有且仅有一个属性 value,该对象中的值一旦被改变和访问就会被跟踪到,通过修改 refData.value 的值,可以触发模版的重新的渲染,显示最新的值。reactive 则是修改 state.reactiveField 的值。
    • 如果不使用