草庐IT

Web组件开发

全部标签

javascript - Vue.js 访问父组件

我有一个具有此方法的子组件:getSubscriptions(){MessageService.subscriptions()this.$parent.loading=true;.then((data)=>{if(data.data.subscriptions==null){this.noSubscriptions=true;}else{this.subscriptions=data.data.subscriptions;}this.$parent.loading=false;}).bind(this);}所以我想在我的父组件中显示一个加载圆,我这样访问它:this.$parent.l

javascript - 为动态创建的组件添加事件绑定(bind)

我使用ViewContainerRef.createComponent()方法在app.component.ts中动态创建组件,该方法返回一个ComponentRef对象.letnewComponent:ComponentRef=this.filtersSection.createComponent(MyDateRangeComponent);我需要动态地向这个组件添加一个事件监听器,以便它监听onDateRangeChange事件并执行app中定义的dateRangeChanged(event)方法.component.ts组件。我最初在app.component.html中以这种方

javascript - vuejs v2.0 向组件传递数据

我使用vue.js在Laravel5.3上构建了一个应用程序,我开始转向vue.js以使页面动态化。我在一个页面上完成了所有工作,所以想将其转换为一个组件,但在这样做之后我收到以下错误:[Vuewarn]:ErrorwhenrenderingcomponentatC:\xampp\htdocs\.......TypeError:Cannotreadproperty'nxt_weekly'ofundefined我像这样将数据传递给View:constapp=newVue({el:'#app',mounted:function(){this.fetchEvents();},data:{lo

javascript - React组件属性中es6模板字符串

我可以使用双引号和单引号连接我的动态变量,但模板字符串更清晰。我得到了一个意想不到的token,有什么线索吗?...return()... 最佳答案 您需要将其更改为以下代码。return() 关于javascript-React组件属性中es6模板字符串,我们在StackOverflow上找到一个类似的问题: https://stackoverflow.com/questions/44426933/

javascript - 如何在开发者控制台中使用 Chrome 注入(inject) jQuery?

问题我曾经能够(在本地)使用以下两个Chrome扩展中的任何一个来轻松地将jQuery注入(inject)到还没有jQuery的页面中,并且我没有拥有(客户端)来试验设计更改、开发修改和实时故障排除:jQueryInjector-ChromeWebStorejQueryEverywhere-ChromeWebStore不幸的是,现在由于防止“XSS”(跨站点脚本)的最新热潮,这些插件不再有效。这些变化背后可能有一个崇高的目的,我只是想了解发生了什么变化。我认为这与“内容安全策略”有关,我最近才听说,对此知之甚少。我第一次知道XSS是2011年的浏览器问题,但是之前XSS的防范措施从来没

javascript - 如何在自定义组件中使用 Vue.js 插件?

我需要输出一个表格,它的内容可以通过Ajax更新。所以我打算使用vue-tables-2(https://github.com/matfish2/vue-tables-2),这是一个Vue.js插件。使用Laravel方式,我正在编写一个Vue.js自定义组件,那么如何在我的组件中使用vue-tables-2插件?这里是一个如何使用插件的例子https://jsfiddle.net/matfish2/jfa5t4sm/.不幸的是,示例中没有将插件包装在组件中。 最佳答案 您可以通过两种方式使第三方组件对您的自定义Vue组件可用:1。

javascript - 如何使用 web3js 发送 ERC20 token

我目前使用的是Web3JavaScriptAPI的0.2x.x版本。我通过在solidity中创建智能合约(在REMIXIDE上)部署了我的自定义ERC20token。我安装了MetaMask并在https://wallet.ethereum.org/上进行了测试将一些自定义ERCtoken发送到另一个我的帐户。它运作良好。我想使用Web3js在我的JavaScript代码中添加“发送自定义ERC20token”功能。下面是我的代码。varhttp=require('http');varWeb3=require('web3');varTx=require('ethereumjs-tx'

javascript - 子组件的 v-model 和子组件 Vue 中的 v-model

有没有办法简化这段代码?该按钮还应更改子项的localValue。Vue.component('my-input',{template:`MyInput:localValue:{{localValue}}`,props:['value'],data(){return{localValue:this.value}},watch:{value(){this.localValue=this.value},localValue(){this.$emit('input',this.localValue)}}})newVue({el:'#app',data:()=>({parentValue:'I

javascript - 函数和无状态组件之间的区别?

下面的两个示例显然产生了完全相同的代码。示例1(React子项):constChild=({item:{startedAt,count}})=>({startedAt}{count})constParent=items=>{return({items.map((item,index)=>())})}exportdefaultParent示例2(子函数):constchild=({id,startedAt,count})=>({startedAt}{count})constParent=items=>{return{items.map(child)}}exportdefaultParen

javascript - Jest Enzyme 如何对包装组件的存在进行浅层测试

我正在测试一个有条件地呈现包装组件的组件。我正在使用enzyme和jest,根组件是通过shallow()方法呈现的。问题是测试Root组件是否包含包装组件。如何在不使用mount()渲染方法的情况下测试包装组件是否存在?hoc.component.jsxexportfunctionHOC(Component){render(){return}}wrapped.component.jsxclassWrappedComponentextendsReact.Component{...}exportdefaultHOC(WrappedComponent)root.component.jsxc