使用方法及细节就不一一说了。

1.给input或者textarea绑定value时,出现失效的问题。解决方法:https://github.com/vuejs/babel-plugin-transform-vue-jsx/issues/84;

2.给input绑定disabled属性时,出现时而有效时而有效的问题。解决方法同上,也是domPropsDisabled={this.disabled} (假如你定义了disabled的话);

3.在封装高阶组件时,v-model出现问题!写法如下:解决方法是加上了value={this.value}。后来在此组件中放弃了jsx的写法。搞定!

 render() {
return (
<z-input
styles={this.styles}
inputStyles={this.inputStyles}
v-model={this.inputValue}
value={this.value}//注意这里要加上value={this.value},否则在输入字母时会出现input组件中的value是inputEvent的问题!为什么?
disabled={this.disabled}
validate={this.validate}
onInput={this.handleInput}
>
<div slot="prepend" onClick={this.minus}>
-
</div>
<div slot="append" onClick={this.add}>+</div>
</z-input>
);
},

4.其他待发现

5.能不用jsx就不用。

记录在vue中使用jsx时踩过的坑的更多相关文章

  1. 在Vue中使用JSX,很easy的

    摘要:JSX 是一种 Javascript 的语法扩展,JSX = Javascript + XML,即在 Javascript 里面写 XML,因为 JSX 的这个特性,所以他即具备了 Javasc ...

  2. vue中使用jsx

    vue中使用jsx 为什么需要使用jsx呢?这个需要搞清楚 其实vue官方也说了,对于那些非常多v-if v-else的情况,就可以尝试使用render函数或者jsx,不过render函数写简单的结构 ...

  3. vue中使用JSX报错,如何解决

    Support for the experimental syntax 'jsx' isn't currently enabled (32:12): 30 | }, 31 | render() { & ...

  4. 在PyQt5中使用Pandas时的几个坑

    最近在看Python GUI编程,在用到PyQt5+Pandas时遇到一些问题.这里把问题和解决方法整理一下.备查. (好像不能上传附件,内容只好写在下面了.) 在PyQt5中使用Pandas时的几个 ...

  5. 在vue中使用jsx语法

    什么是JSX? JSX就是Javascript和XML结合的一种格式.React发明了JSX,利用HTML语法来创建虚拟DOM.当遇到<,JSX就当HTML解析,遇到{就当JavaScript解 ...

  6. VUE中集成echarts时 getAttribute of null错误

    错误 错误场景一: 错误提示: 在运行Vue项目时出现了上述错误,出现该错误的原因是Echarts的图形容器还未生成就对其进行了初始化所造成的,代码如下: // 基于准备好的dom,初始化echart ...

  7. vue中prop传值时加不加v-bind(冒号:)

    前言:有关Vue中父组件通过prop传值给子组件时,是否加v-bind的问题,没弄清楚时感觉很乱,弄清楚之后很简单. 由于结果记起来很容易,所以先给出结果: 只有传递字符串常量时,不采用v-bind形 ...

  8. vue中使用定时器时this指向问题

    在写一个很小的demo时,用的普通函数写法,没有用es6箭头函数,发现this变化了,后来查找到了问题所在: 箭头函数中的this指向是固定不变(定义函数时的指向),在vue中指向vue 普通函数中的 ...

  9. vue中使用定时器时this指向

    箭头函数中的this指向是固定不变(定义函数时的指向),在vue中指向vue; 普通函数中的this指向是变化的(使用函数时的指向),谁调用的指向谁.   箭头函数: let timerOne = s ...

随机推荐

  1. Python中文

    在python中有两种默认的字符串:str和unicode.在Python中一定要注意区分"Unicode字符串"和"Unicode对象"的区别. 后面所有的& ...

  2. [转]ORACLE递归查询

    转自:http://www.oracle.com/technetwork/cn/articles/hartley-recursive-086819-zhs.html 递归数据库处理,也称为材料清单 或 ...

  3. java获取泛型信息

    总结一下java中获取与泛型相关的信息的知识,不如说是使用方法.网上也有很多类似的优秀文章,这里主要做一个知识的总结.通过反射获取泛型信息的常见例子: //bean package testProje ...

  4. java多线程系列(九)---ArrayBlockingQueue源码分析

    java多线程系列(九)---ArrayBlockingQueue源码分析 目录 认识cpu.核心与线程 java多线程系列(一)之java多线程技能 java多线程系列(二)之对象变量的并发访问 j ...

  5. Unity3D游戏xlua轻量级热修复框架

    这是什么东西 前阵子刚刚集成xlua到项目,目的只有一个:对线上游戏C#逻辑有Bug的地方执行修复,通过考察了xlua和tolua,最终选择了xlua,原因如下: 1)项目已经到了后期,线上版本迭代了 ...

  6. 学习MySQL(上)

    具体实例 1.PHP 服务器组件 对于初学者建议使用集成的服务器组件,它已经包含了 PHP.Apache.Mysql 等服务,免去了开发人员将时间花费在繁琐的配置环境过程. Window 系统可以使用 ...

  7. Web攻防之暴力破解(何足道版)

    原创文章 原文首发我实验室公众号 猎户安全实验室 然后发在先知平台备份了一份 1 @序 攻防之初,大多为绕过既有逻辑和认证,以Getshell为节点,不管是SQL注入获得管理员数据还是XSS 获得后台 ...

  8. springmvc中对日期格式化的处理

    @DateTimeFormat(pattern="yyyy-MM-dd") 返回的时候java.util.Date pattern="yyyy-MM-dd"必须 ...

  9. 搭建一个属于自己的webpack config(-)

    搭建一个属于自己的webpack config(-) 前期准备 环境说明 mac 10.12.6 node v8.8.1 npm 5.4.2 全局安装下webpack.webpack-dev-serv ...

  10. mysql如何查看索引使用情况以及优化 - guols0612

    mysql中支持hash和btree索引.innodb和myisam只支持btree索引,而memory和heap存储引擎可以支持hash和btree索引 我们可以通过下面语句查询当前索引使用情况: ...