草庐IT

babel-plugin-transform-vue-jsx

全部标签

javascript - 使用@babel 转译 Array.prototype.flat?

我使用Array.prototype.flat无意中在我的React应用程序中引入了向后兼容性问题。我很惊讶这没有通过转译得到解决——我认为这会产生es2015兼容代码。我怎样才能让Babel7转译这个?(如果我对Babel6中的源代码的阅读是正确的,那么仍然有一个插件,但是自从它开始推广到浏览器支持已经被删除?)工具:@babel/core@7.0.0webpack@4.18.0我的顶级配置文件如下所示:webpack.config.jsvarpath=require('path')module.exports={entry:"./src/index.js",output:{path

javascript - 如何将 vue.js 与 django 集成?

这是带有vue.js的单页应用程序,它进行了一些简单的计算,我试图在django中实现这个计算,但它没有给我想要的结果。在这里,我在vue.js中创建了动态数组,这只完美地显示了产品的图像,但没有显示product.name和product.sell_price以及@click.prevent="addToCart(product)"这个功能不起作用??我该如何解决?vue.jsnewVue({el:'#posApp',data:{total:0,discount:0,products:[{%forproductinproducts%}{"id":{{product.id}},"nam

javascript - 测试 Vue.js 组件

我想测试一个Vue.js组件,但我失败了。简单地说,我正在设置一个组件属性,我想断言它设置正确。如果这很重要,模块将加载导出,并使用Webpack输出JS。//componentexports=module.exports={};module.exports={data:function(){return{active:false};},methods:{'close':function(){console.log(this.active);//->truethis.active=false;console.log(this.active);//->false}}};//compone

javascript - 从父级访问 Vue 中组件的计算属性

如何从父级访问Vue中组件的计算属性?在此示例中,我有一个包含商品组件的购物车,我想计算并显示购物车商品的总和:购物车.jsvarvm=newVue({el:'#cart',components:{cartItem:require('./components/cart-item.js'),},data:{items:[{name:'apple',qty:5,price:5.00},{name:'orange',qty:7,price;6.00},],},computed:{//IwanttodosomethinglikethisandaccesslineTotalfromcartcar

javascript - 动态注册本地 Vue.js 组件

我们知道possible像这样动态注册全局Vue.js(版本1)组件:Vue.component('my-component',MyComponent)有没有办法对本地组件执行相同的操作,即那些仅对特定组件可用/可见的组件?我的想法是,我希望能够像这样传递要在本地注册的组件:所以在outer-component中我可以做:created(){this.someMethodINeedToRegisterLocalComponent('cool-component',this.localComponentToBeRegisteredDynamically);},

javascript - 尝试通过 Vue.js 中的渲染传递 Prop 并观看它们

我在使用vue.js中的CreateElement/render将Prop从父级向下传递到创建的子级时遇到问题,然后再观看它。这是我的父组件Vue.component('my-drawing',MyDrawing)newVue({el:'#drawing',mounted(){Bus.$on('emitColorSelection',(emitString)=>{console.log("insidesocket.js/my-drawingandemitStringis",emitString);this.useColor=emitString;console.log('insides

javascript - 如何使用 Vue Slider 控制元素

我在requestsjson对象中有一堆数据。默认情况下,所有数据都会显示给用户。此外,我还有一个slider组件。我正在尝试实现这样的功能,即当用户移动slider时,json的元素会根据slider的值出现/消失。例如:数据:requests:[{value:10,name:"foo"},{value:12,name:"bar"},{value:14,name:"foobar"},{value:22,name:"test"},{value:1,name:"testtooo"},{value:8,name:"something"}]默认情况下,我希望显示所有数据,但当用户移动slid

javascript - Webpack babel-loader runtime : Module build failed: TypeError: this. setDynamic 不是函数

我正在尝试将babel-loader与babel-plugin-transform-runtime一起使用。我已按照以下说明进行操作:https://github.com/babel/babel-loader#babel-is-injecting-helpers-into-each-file-and-bloating-my-code相关代码:rules:[//the'transform-runtime'plugintellsbabeltorequiretheruntime//insteadofinliningit.{test:/\.js$/,exclude:/(node_modules

javascript - 如何在 React jsx 中有一个外部 JSON 配置文件

我想在我基于React的项目中有一个外部配置文件(JSON)。这是最终结果,或者当我交付它(公用文件夹和bundle.js)时,我的配置文件也应该被提供。用户应该能够根据自己的意愿更改配置并使用我的应用程序。那是没有重新编译我的代码的人应该能够使用它。换句话说,配置文件不应与我的应用捆绑在一起。 最佳答案 接受的答案可能有效。但是,为什么要搞得这么复杂呢?第一步。创建文件Config.js,包含内容varConfigs={prop1="abc",prop2="123"}步骤#2。通过脚本标签加载index.html中的文件。步骤#3

javascript - babel 装饰器和 TypeScript 的一样吗?

我经常使用TypeScript编写代码,但很少使用babel,我知道TypeScript如何在装饰器上工作,而babel也支持装饰器,它们的行为是否相同? 最佳答案 是的,它们是相同的,从某种意义上说它们产生相同的行为,但它们有不同的实现。两者都遵循ECMAScript规范并尽早为我们带来功能。您可以预期它们两者上的内容将来可能会受到节点或浏览器的支持。代码:functionf(){console.log("f():evaluated");returnfunction(target,propertyKey,descriptor){c