草庐IT

按钮组件

全部标签

javascript - 将按钮注入(inject)站点(Chrome 扩展内容脚本)

我正在尝试使用Chrome的内容脚本在页面上插入一个按钮,但该按钮从未出现,而且我在控制台中也没有收到任何错误。我的manifest.json文件:{"name":"Test","version":"0.0.1","manifest_version":2,"description":"Test","default_locale":"en","permissions":[""],"content_scripts":[{"matches":[""],"js":["src/inject/inject.js"]}]}和我的inject.js文件:document.addEventListene

javascript - VueJS - 将插槽传递给子组件的子组件

我有一个列表和一个list_item组件,我在我的应用程序中经常重复使用它们。简化形式:contact_list.vue.table.table-header.table-row.table-colContact.table-colInfo.table-bodycontact-list-item(v-for='contactincontacts',:contact='contact',@click='doSomething()')contact_list_item.vue.table-row(@click='emitClickEvent').table-col{{contact.nam

javascript - 中继现代 RefetchContainer Prop 未传递给组件

我在RelayModern中设置refetchContainer时遇到一些问题。父组件是QueryRenderer,它运行初始查询,适本地填充子组件的Prop(a-prop-riately?嗯?嗯?!)。refetchContainer指定了我们所有的变量,并在输入字段的onChange事件上,使用新变量重新运行查询。这一切都很完美,除了child的Prop永远不会用收到的新数据更新。我可以深入中继存储并查看确实收到了带有适当数据的查询。一段时间以来我一直在反对这个问题,我会很感激一些帮助。可能我缺少一些简单的东西。上帝知道RelayModern文档很少。我四处寻找,找不到合适的解决方

javascript - 使用三元表达式渲染组件

我去使用三元表达式渲染一个组件。目前我正在做这样的事情{this.state.loaded?():(Loading..)}但这不起作用,并抛出一个错误提示InvariantViolationExceptionsManager.js:84UnhandledJSException:InvariantViolation:InvariantViolation:Textstringsmustberenderedwithinacomponent.[问题:]如何修复它并在三元表达式中渲染整个组件Ps:据此stackoverflowquestion:当我们进行内联条件渲染时会发生这种情况。

javascript - mounted() 仅在组件 Vue.js 上运行一次

我有两个使用v-if有条件地渲染的组件:我在mounted()下有两个组件的加载动画,我只想在第一次加载它们时运行。但是对于已安装的组件,每次当this.mode更改时重新创建组件时,动画都会再次触发。我怎样才能避免这种情况? 最佳答案 您可以将您的组件包装在一个keep-alive元素中.. 关于javascript-mounted()仅在组件Vue.js上运行一次,我们在StackOverflow上找到一个类似的问题: https://stackoverf

javascript - onchange 不适用于单选按钮

我有几个单选按钮应该调用hider(something);当它们改变时,意思是当它们被选中或未被选中时。这起作用,即,当检查时,他们调用JS函数,但是,如果由于从该组中选择了另一个广播按钮而没有选中,则不会再次调用JS脚本。我需要使用onchange以外的东西吗?这是单选按钮目前的样子:solarislinux我的隐藏函数目前是:functionhider(divid){if($(divid).is('.hidden')){$(divid).removeClass('hidden');}else{$(divid).addClass('hidden');}}

javascript - preventDefault() 和单选按钮的奇怪行为

查看这个jsFiddle:http://jsfiddle.net/nathanfriend/vAcpc/9/似乎preventDefault()方法不会阻止单击的单选按钮切换(请注意消息总是说“已选中此单选按钮”,无论其先前状态如何)。但是,在onclick()方法完成后,单选按钮会快速回到其初始状态(第一次选择单选按钮时除外)。preventDefault()似乎并不是通过实际阻止单选按钮被选中来工作的,而是通过将按钮集返回到它们之前的状态来工作的。谁能解释这种行为?我希望能够完全防止单选按钮被切换——这样我就可以准确地检查单选按钮是否在其onclick()方法中被选中。有任何想法吗

javascript - 编写 v1 嵌套 Web 组件

我是网络组件的新手。由于webcomponentsv1可用,我从那里开始。我已经阅读了网络上关于它们的各种帖子。我对正确地组合它们特别感兴趣。我已阅读有关槽的信息并让它们正常工作,尽管我的努力并未产生按我预期的方式工作的槽式Web组件。如果我像这样组成嵌套的web组件,嵌套/开槽的web组件中的DOM不会插入到父级的槽中:这是父网络组件HTML:由于每个web组件(父和子)都是独立编写的,所以我一直在创建它们:customElements.define('component-name',classextendsHTMLElement{constructor(){super();this

javascript - React - 获取父组件中子组件中的引用

我不会尝试使用refs做任何骇人听闻的事情。我只需要元素的引用,因为元素是Canvas,要在Canvas上绘图,你需要它的引用。classParentextendsComponent{clickDraw=()=>{//whenbuttonclicked,getthecanvascontextanddrawonit.//how?}render(){return(Draw);}}classChildextendsComponent{componentDidMount(){constctx=this.canvas.getContext('2d');//drawsomethingontheca

javascript - React JS 中在特定 Prop 更改时调用组件方法的正确模式是什么?

使用React和Redux,假设您有一个向外部API发送请求的组件方法。importReact,{Component}from'react';import{connect}from'react-redux';classMyCompextendsComponent{boolUpdate(val){fetch('http://myapi.com/bool',{val});}shouldComponentUpdate(nextProps){returnfalse;}render(){returnHello;}}constmapStateToProps=({bool})=>({bool});e