遇到如下错误:

v-model does not support dynamic input types

解决方法:

vue 2.5.0以上,支持动态绑定

<input :type="type" :name="name" :id="name" v-model="inputVal">

vue 2.5.0以下,可以使用v-if来做

<input v-if="type == 'text'" type="text" :name="name" :id="name" v-model="inputVal">
<input v-if="type == 'number'" type="number" :name="name" :id="name" v-model="inputVal">

出处:https://stackoverflow.com/questions/44461188/vue2-v-model-does-not-support-dynamic-input-types

vue动态(type可变)input绑定的更多相关文章

  1. vue中多个input绑定enter按键事件

    默认再每个input上加 keyup.enter 是可以绑定事件的 可是多个input一起绑定同一个事件就比较麻烦 所以就在vue dom里面遍历查找并绑定事件 let handleEnter = ( ...

  2. VUE动态(自动)Loading【绑定到URL】,同页面多个Loading互不冲突

    需求来源:当使用React时,使用 umi loading 很方便,页面对http请求发生改变时,也会自动改变loading的相关状态(true/false) 对VUE插件进行找寻,发现没找到合适内容 ...

  3. Vue表单控件绑定

    前面的话 本文将详细介绍Vue表单控件绑定 基础用法 可以用 v-model 指令在表单控件元素上创建双向数据绑定.它会根据控件类型自动选取正确的方法来更新元素.v-model本质上不过是语法糖,它负 ...

  4. vue 表单输入与绑定 v-model

    vue使用 v-model 指令在表单 <input>.<textarea> 及 <select> 元素上创建双向数据绑定.下面我们通过示例先了解下基本用法: &l ...

  5. vue中v-model 数据双向绑定

    表单输入绑定 v-model 数据双向绑定,只能应用在input /textare /select <div id="app"> <input type=&quo ...

  6. jQuery对 动态添加 的元素 绑定事件(on()的用法)

    从jQuery 版本 1.7 起,on() 方法是向被选元素添加事件处理程序的(官方推荐)首选方法. 当浏览器下载完一个页面的时候就开始渲染(翻译)HTML标签,然后执行css.js代码,在执行js代 ...

  7. vue.js中,input和textarea上的v-model指令到底做了什么?

    v-model是 vue.js 中用于在表单表单元素上创建双向数据绑定,它的本质只是一个语法糖,在单向数据绑定的基础上,增加了监听用户输入事件并更新数据的功能: 对,它本质上只是一个语法糖,但到底是一 ...

  8. 从Object.definedProperty中看vue的双向数据的绑定

    前言 Object.defineProperty是ES5中的方法,它可以直接在一个对象上定义一个新属性,或者修改一个对象的现有属性, 并返回这个对象.vue.js正式利用这种方法实现数据的双向绑定,以 ...

  9. vue 如何在循环中绑定v-model

    vue 如何在循环中绑定v-model 我现在有这么一个需求,页面上有多项输入框,但是具体有多少项,我也不知道,它是通过"新增一项"按钮点击事件,点击一下,就新增一项:如下图这个样 ...

随机推荐

  1. 牛客小白月赛2 H 武 【Dijkstra】

    链接:https://www.nowcoder.com/acm/contest/86/H来源:牛客网 题目描述 其次,Sεlιнα(Selina) 要进行体力比武竞赛. 在 Sεlιнα 所在的城市, ...

  2. SVN中trunk,branches,tags用法详解(转载)

    转载出处:http://www.cnblogs.com/dafozhang/archive/2012/06/28/2567769.html Subversion是一个自由开源的版本控制系统.在Subv ...

  3. Percona-Tookit工具包之pt-pmp

      Preface       Sometimes we need to know the details of a program(porcess) when it is running even ...

  4. linux文件访问过程和权限

    第1章 文件访问过程详解 1.1 文件访问过程 第2章 权限 2.1 对于文件rwx含义 r读取文件内容 w修改文件内容 需要r权限配合 只有w权限的时候,强制保存退出会导致源文件内容丢失 x权限表示 ...

  5. php-5.6.26源代码 - 扩展模块的加载、注册

    // main实现在文件 php-5.6.26\sapi\cgi\cgi_main.c int main(int argc, char *argv[]) { .... cgi_sapi_module- ...

  6. python错误处理之try...except...finally...错误处理机制。

    今天学习了python的错误处理. 在程序处理的过程中,经常会出现错误,一旦出错就会非常麻烦.所以有的高级语言通常都内置了一套  try...exept...finaly...的错误处理机制,pyth ...

  7. 从coding.net 克隆(git clone)项目代码到本地报无权限(403)错误 解决方案

    直接从coding.net (git clone)项目代码到本地时,会提示没有权限的错误,如下图: 解决方案:添加远程地址的时候带上用户名及密码即可解决,格式如下: git clone http:// ...

  8. CERC2017 F: Faulty Factorial 简单数论题

    #include <iostream> using namespace std; #define ll long long ; ll n,p,r; ll poww(ll a,ll b){ ...

  9. TouTiao开源项目 分析笔记9 实现一个问答主页面

    1.根据API返回创建几个基础的Bean 1.1.WendaArticleDataBean类 API返回的数据如下: /** * cell_type : 36 * extra : {"wen ...

  10. 15.6,redis主从同步

    redis主从同步 原理:1. 从服务器向主服务器发送 SYNC 命令.2. 接到 SYNC 命令的主服务器会调用BGSAVE 命令,创建一个 RDB 文件,并使用缓冲区记录接下来执行的所有写命令.3 ...