草庐IT

虚拟键盘组件

全部标签

javascript - 防止键盘弹出文本框焦点/点击 iPad webapps

我正在尝试在iPad应用程序上创建自定义键盘。但每次输入获得焦点时,都会弹出原生iPad键盘。我怎样才能在JavaScript中防止这种情况。 最佳答案 将“只读”属性添加到您的输入中,并提供一种不同的填充值的方法。 关于javascript-防止键盘弹出文本框焦点/点击iPadwebapps,我们在StackOverflow上找到一个类似的问题: https://stackoverflow.com/questions/3777669/

javascript - 从子组件访问 onChange 事件 (React/Redux)

我有一个容器组件,它使用输入渲染一个子组件。我想在onChange事件期间访问子组件的值,但我得到的是“代理”对象而不是输入值。容器组件...classInputContainerextendsReact.Component{handleChange=(val)=>{console.log(val);//=>Proxy{[[Handler]]:Object,[[Target]]:SyntheticEvent,[[isRevoked]]:false}}render(){return;}}exportdefaultconnect(mapStateToProps,mapDispatchToP

javascript - 向样式化组件添加过渡

我在React中有以下组件:constButton=styled.div`width:30px;height:30px;position:absolute;right:2em;top:50%;transform:translateY(-50%);padding:0;margin:0;&::before,&::after{content:"";position:absolute;background-color:#3d3935;transition:transform0.25sease-out;}&::before{top:0;left:50%;width:4px;height:100%

javascript - 如何在 Chrome 扩展中使用给定的字符/键码初始化键盘事件?

我正在开发一个模拟网页上键盘事件的GoogleChrome扩展程序。我发现event.initKeyboardEvent()不能正常工作因为thiswebkitbug我还找到了一些解决方法,例如SOQuestion但是,在事件对象上定义属性是行不通的,因为扩展的内容脚本有自己的“平行世界”,所以在内容脚本中定义的属性对网页脚本不可见。我唯一也是最后的希望,DOM4事件构造函数可以在GoogleChrome中运行,并且可以通过构造函数正确初始化键盘事件varevent=newKeyboardEvent("keypress",{key:'U+0041',char:'a',...})不幸的是

javascript - React 如何更新另一个组件的状态?

我对react很陌生,试图让一些组件工作。我有ObjectA:React.createClass({propTypes:{...},getInitialState:function(){return{myState:null}},updateMyState:function(value){this.setState({myState:value})}render:function(){return('hello'+{this.state.myState});}});ObjectB:React.createClass({propTypes:{...},render:function(){

javascript - 如何将自定义组件与 react-router 路由转换一起使用?

文章ConfirmingNavigation说明如何在转换Hook中使用浏览器确认框。美好的。但我想使用我自己的对话框。如果我要使用history模块中的方法,我认为这是可能的。是否可以使用react-router中的setRouteLeaveHook来做到这一点? 最佳答案 核心问题是setRouteLeaveHook期望钩子(Hook)函数同步返回它的结果。这意味着您没有时间显示自定义对话框组件、等待用户单击一个选项,然后然后返回结果。所以我们需要一种方法来指定一个异步钩子(Hook)。这是我写的实用函数://Asynchron

javascript - React 16.3 中的上下文组件无效

我正在尝试在React16.3.1中使用新的Context组件。我正在运行一个非常简单的示例:constTestContext=React.createContext();exportdefaultclassTestextendsComponent{render(){return({value=>({value})});}}但是代码不会呈现,而是产生此错误:未捕获错误:元素类型无效:应为字符串(对于内置组件)或类/函数(对于复合组件)但得到:对象。似乎Provider和Consumer组件都不是有效组件,无法由React呈现。我是不是漏掉了什么? 最佳答案

javascript - 根据名称渲染 React 组件

上下文:我正在开发一个基于小部件的Web应用程序(就像已停用的iGoogle,用户可以在其中选择他们想要显示的小部件)。每个小部件都是一个React组件。简化示例:这里有2个不同的小部件varHelloWidget=React.createClass({render:function(){returnHello{this.props.name};}});varHiWidget=React.createClass({render:function(){returnHi{this.props.name};}});作为用户,我选择了HiWidget,我的名字是“dude”,所以当系统从持久层

javascript - Ember 组件集成测试 : `link-to` href empty

我正在尝试编写组件集成测试,lathisblogpost,但我的组件有一个指向动态路由的link-to并且href属性没有被填充。这是我正在尝试的简化版本做。我的组件模板:{{#link-to"myModel"model}}这是我测试的相关部分:this.set('model',{id:'myId',name:'MyName'});this.render(hbs`{{my-componentmodel=model}}`);assert.equal(this.$('a').attr('href'),'/myModel/myId');//fails呈现link-to,只是没有href属性。

javascript - 从每个助手调用的组件中产生

这是我的组件模板的一部分:{{#eachdisplayResults}}{{#ifcontroller.template}}{{yield}}{{else}}{{displayHelpercontroller.searchPath}}{{/if}}{{/each}}我希望用户能够自定义用于显示结果的html。问题是{{yield}}在{{#each}}助手中被调用,如果组件声明如下:{{#auto-suggestsource=controller.employeesdestination=controller.chosenEmployees}}{{fullName}}{{/auto-s