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

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. Xilinx FPGA LVDS应用

    最近项目需要用到差分信号传输,于是看了一下FPGA上差分信号的使用.Xilinx FPGA中,主要通过原语实现差分信号的收发:OBUFDS(差分输出BUF),IBUFDS(差分输入BUF). 注意在分 ...

  2. python开发 getpass获取操作系统登陆名

    需用使用python getpass模块 import getpass def get_system_user_name(): return getpass.getuser() def main(): ...

  3. 大雄和哆啦A梦

    题目:大雄和哆啦A梦题目介绍:这个图片名称有点奇怪?! 1,打开链接会看到大雄和哆啦A梦的照片,把它下载下来.就是下面这个图片. 2,用wireshark打开,会看到最后面出现 rar ,还有flag ...

  4. Vuex非常适合新手的教程,保教不会!

    本讲解基于Vue-cli(脚手架)搭建的项目. Vuex 数据状态管理工具,整个流程类似依赖注入,相当于预先定义,倒推.(个人理解) 1. 安装vuex  命令行输入 npm install vuex ...

  5. Flash真的老了,HTML5将取代其地位

    简单讲一些网页开发的趋势吧! Flash老了 Flash是一个落后于时代的技术,靠对客户端的高资源占用率来获取传输过程的低带宽占用. Flash不再安全 Flash是一个落后于时代的技术,靠对客户端的 ...

  6. tensorflow初探

    TensorFlow是一个采用数据流图,用于数值计算的开源软件库.自己接触tensorflow比较的早,可是并没有系统深入的学习过,现在TF在深度学习已经成了"标配",所以打算系统 ...

  7. Mysql--数据的操作

    1.插入数据 1.1 插入完整数据记录 语法1: 例子: 语法2: 例子: 1.2 插入数据记录一部分 语法: 例子: 1.3 插入多条数据记录 1.插入多条完整的数据 语法: 例子:   插入多条部 ...

  8. 【转】千万不要在JS中使用连等赋值操作

    原文链接 千万不要在JS中使用连等赋值操作   目录 前言 赋值顺序? 连续赋值能拆开写么? 后记 前言 文章标题这句话原本是在国外某JavaScript规范里看到的,当时并没有引起足够的重视,直到最 ...

  9. 【原创】1、简单理解微信小程序

    先看下网站的运行方式: 而小程序是这样: what?就这样?是的,就这样.那小程序官方提供的Wafer,还有Wafer2...想太多了,抛弃它们吧.不应当为了解决一个简单的旧问题而去整一个复杂的新问题 ...

  10. 前端页面适配的rem换算

    为什么要使用rem 之前有些适配做法,是通过js动态计算viewport的缩放值(initial-scale). 例如以屏幕320像素为基准,设置1,那屏幕375像素就是375/320=1.18以此类 ...