今天封装一个公用组件库,期间使用到了JSX,发现在Data配置中去配置渲染函数出现了 h function is not defined的问题??

网上查询一大堆所谓安装JSX的东西,其实Vue-cli内置了JSX的语法支持,是可以直接使用的,但是有坑的是你在data中配置返回JSX的话,这个时候的vue是不会内置的 const h = $createElement,所以报错了!!!

https://cn.vuejs.org/v2/guide/render-function.html#%E6%A8%A1%E6%9D%BF%E7%BC%96%E8%AF%91。

该官方文档有说明:

此时的解决方案就是将data中的渲染函数移动到方法中即可!!!

Vue-cli JSX踩坑问题!的更多相关文章

  1. vue cli+axios踩坑记录+拦截器使用,代理跨域proxy(更新)

    16319 1.首先axios不支持vue.use()方式声明使用,看了所有近乎相同的axios文档都没有提到这一点建议方式 在main.js中如下声明使用 import axios from 'ax ...

  2. vue cli+axios踩坑记录+拦截器使用,代理跨域proxy

    1.首先axios不支持vue.use()方式声明使用,看了所有近乎相同的axios文档都没有提到这一点 建议方式 在main.js中如下声明使用 import axios from 'axios'; ...

  3. vue配置环境踩坑

    Vue 环境配置踩坑 目录 Vue 环境配置踩坑 windows下cnpm -v :无法将"cnpm"项识别为 cmdlet.函数.脚本文件或可运行程序的名称. windows下c ...

  4. vue+ vue-router + webpack 踩坑之旅

    说是踩坑之旅 其实是最近在思考一些问题 然后想实现方案的时候,就慢慢的查到这些方案   老司机可以忽略下面的内容了 1)起因  考虑到数据分离的问题  因为server是express搭的   自然少 ...

  5. vue搭配axios踩坑

    客户端项目中有一个小需求“我的卡券”,有单独入口,所以综合考虑之后,采用了vue来实现,因为是初次使用,导致了选型不当,先用了SUI-Mobile来搭建页面,当决定使用vue的时候,页面也搭建完毕了, ...

  6. vue + element-ui 制作tab切换(切换vue组件,踩坑总结)

    本篇文章使用vue结合element-ui开发tab切换vue的不同组件,每一个tab切换的都是一个新的组件. 1.vue如何使用element-ui 上一篇文章已经分享了如何在vue中使用eleme ...

  7. vue项目打包踩坑记

    基于webpack+vue-cli下的vue项目打包命令是 npm run build ,等待打包完成后在根目录生成dist文件夹,里面包含了所有项目相关的内容. 注意:需要完整版的vue-cli项目 ...

  8. [ vue ] quasar框架踩坑:在vue文件外导入路由,执行router.push('/')没有效果

    问题描述: 1. 如图所示的项目结构目录, axios.js 文件负责拦截全局请求和回复,我在拦截回复的代码中写了:如果服务器回复了一个401错误,则执行Router.push('/'),但是该方法失 ...

  9. Vue.Js初学踩坑

    1 Vue2之后取消了v-bind的.sync修饰符,意味着父子组件的数据不能以此来实现双向绑定. 2 Vue2之后取消了filterBy过滤器,所以以下这种用法是错误的了. <tbody> ...

  10. Vue中axios踩坑之路-POST传参

    https://blog.csdn.net/call_me_fly/article/details/79012581

随机推荐

  1. vue-admin-template 单页面刷新 404 问题

    vue-admin-template (vue-element-admin)是个非常好用的B端UI框架,谁用谁知道! 在使用的过程中,加入权限模块后,刷新后权限控制的页面就默认跳转到404页面了,搞了 ...

  2. Unity之GPS定位(腾讯sdk)

    Unity之GPS定位(腾讯sdk) 目录 Unity之GPS定位(腾讯sdk) 前言 Unity版本及使用插件 正题 编写脚本 Run运行, 跑起来就行,具体要什么,去相关类找就好了. 没有腾讯地图 ...

  3. tomcat报错:java.io.IOException: No space left on device

    1 简介 今天网站很多页面访问突然就404了,路径分明没有变,是正确的,就很奇怪 排查日志发现报错java.io.IOException: No space left on device 这个错误,是 ...

  4. 真正“搞”懂HTTPS协议18之TLS特性解析

    上一篇,我们讲了TLS的握手过程,我们参照的版本其实是TLS1.2.这个协议是2008年的老协议了,虽然它的价值不言而喻,但是毕竟年纪大了,不太能跟得上时代了.所以,经历了诸多磨难的TLS1.3在20 ...

  5. Osx10.14升级watchman踩坑记

    背景 使用 watchman 检测文件变化通知非常的好用, 但有些时候会出现 watchman 占用内存和 CPU 特别疯狂, 通过 watch-del 也无济与事, 由于 watchman 的版本 ...

  6. Redis 源码解读之 Rehash 的调用时机

    Redis 源码解读之 Rehash 的调用时机 背景和问题 本文想要解决的问题 什么时机触发 Rehash 操作? 什么时机实际执行 Rehash 函数? 结论 什么时机触发 Rehash 操作? ...

  7. LG P2617 Dynamic Rankings

    \(\text{Problem}\) 动态区间第 \(k\) 小 Dynamic Rankings \(\text{Analysis}\) 整体二分 原本一个询问可二分,但多个询问效率太低 考虑离线, ...

  8. Moonraker

    Moonraker 目录 Moonraker 1 信息收集 1.1 端口扫描 1.2 后台目录扫描 1.3 目录分析 1.3.1 /services/ 1.3.2 /svc-inq/salesmoon ...

  9. [EULAR文摘] 新证据: NSAID对AS放射学进展的影响

    新证据: NSAID对AS放射学进展的影响 Sieper J, et al. EULAR 2015. Present ID: OP0145. 背景: 既往有研究显示持续给予NSAID相较于按需给药能在 ...

  10. 「Python实用秘技13」Python中临时文件的妙用

    本文完整示例代码及文件已上传至我的Github仓库https://github.com/CNFeffery/PythonPracticalSkills 这是我的系列文章「Python实用秘技」的第12 ...