zoukankan      html  css  js  c++  java
  • vue中v-model的学习官网参考

    v-model 用在 input 元素上时

    v-model虽然很像使用了双向数据绑定的 Angular 的 ng-model,但是 Vue 是单项数据流,v-model 只是语法糖而已:↓

    <input v-model="sth" />
    <input v-bind:value="sth" v-on:input="sth = $event.target.value" />

    第一行的代码其实只是第二行的语法糖。然后第二行代码还能简写成这样:↓

    <input :value="sth" @input="sth = $event.target.value" />

    要理解这行代码,首先你要知道 input 元素本身有个 oninput 事件,这是 HTML5 新增加的,类似 onchange ,每当输入框内容发生变化,就会触发 oninput ,把最新的value传递给 sth
    如果你不知道 $event 是从哪来的,那你需要点击它再复习一下文档。

    我们仔细观察语法糖和原始语法那两行代码,可以得出一个结论:

    在给 <input /> 元素添加 v-model 属性时,默认会把 value 作为元素的属性,然后把 'input' 事件作为实时传递 value 的触发事件

  • 相关阅读:
    hdu 4707 Pet
    hdu 3584 Cube (三维树状数组)
    poj 2155 Matrix (树状数组)
    poj 1195 Mobile phones (树状数组)
    工厂方法模式
    简单工厂模式
    关于设计模式
    UML类图
    UML
    【转载】UML用例图
  • 原文地址:https://www.cnblogs.com/hulinpeng/p/8883578.html
Copyright © 2011-2022 走看看