草庐IT

react_test_app

全部标签

javascript - 使用按钮和关闭图标关闭 React Semantic UI 模式

我有一个模态窗口,用户需要在其中填写一些表格并通过模态窗口中的按钮保存填写的内容。当用户保存时,我希望模式关闭。我可以通过在Modal组件上使用openProp来完成这项工作。但如果我这样做,当我尝试通过closeIcon这样做时,模态不会关闭。我该怎么做才能让用户通过这两种方法关闭模态框?这是我当前的模态代码:handleCreateButton(evt){evt.preventDefault()//...//codetosavewhateverwastypedintheform//...this.setState({showModal:false})}renderModalForm

javascript - 在 React Native 中将 base64 字符串转换为图像

问题我用expo的ReactNative创建了一个社交媒体应用,想添加上传图片的功能。由于expo不会让你将文件转换为blob来上传,我只是将base64图像数据作为字符串上传到服务器数据库。从服务器下载数据后,如何将这些数据再次转换为可View像? 最佳答案 你可以这样做:varbase64Icon='data:image/png;base64,iVBORw0KGgoAAAANS...';在base64Icon变量中,您需要将base64数据放在data:image/png;base64,之后。像这样:varbase64Icon=

javascript - 如何使用包裹在 react 中添加图像?

我一直在尝试在react中添加图片.我没有使用webpack,我正在使用parceljs.同时使用typescript我试过:importimagefrompath/to/image.png内部react组件:尝试:尝试:还是不行。代码看起来像这样:import*asReactfrom'react';constcomponentName=()=>(); 最佳答案 你需要这样做importimagefrom'path/to/image.png';然后在你的reactJSX中遵循以下代码:

javascript - 运行 "npm test"时没有 console.log 到 STDOUT(开 Jest )

据我所知,在运行脚本时,console.log()应该可以毫无问题地打印到我的控制台的STDOUT。但在我的例子中,我将NPM配置为在从shell发出npmtest时运行Jest,并且测试文件中的任何console.log()都不会在屏幕上打印任何东西。我也尝试使用process.stdout.write()但在运行npmtest时我仍然没有得到自定义输出。我应该如何调试测试脚本中的内容?我不知道这是来自Node、NPM还是Jest的问题。有一个Jestissue看起来和我的很相似,但我仍然无法解决并输出一个简单的字符串;而其余的Jest输出则照常回显。有人遇到过类似的问题吗?编辑1:

javascript - 在 React material-ui 上显示对话框

我正在使用material-ui的Dialogcomponent对于我的React应用程序。如何将组件设置为变量以便调用onShow()方法? 最佳答案 添加Dialog组件时,只需为其添加一个ref即可(例如ref="dialog"):dialogcontent然后您可以使用this.refs.dialog.onShow(...)从您的所有者组件代码中引用它。Dialogcomponent页面实际上在幕后使用了refs,正如你可以从它的sourcecode中看到的那样. 关于javas

javascript - Chrome App localStorage 不持久且 chrome.storage 不工作

我有一个chromeKiosk应用程序,我需要在机器打开和关闭之间保存数据(几个字节作为字符串)。但无论我尝试什么,localStorage似乎都在重启时被删除。当我转到chrome://inspect/#apps检查Chrome应用程序时,控制台中没有关于LocalStorage的相关错误在浏览器的Chrome中,我会简单地使用localStorage,但在Kiosk应用程序中这不会持续存在。代码示例:window.localStorage.setItem(id,temp);window.localStorage.getItem(id);按照这里的建议:Persistdataacro

javascript - 如何使用 App.cable.subscriptions.remove 在 Rails 5 中删除 actioncable channel 订阅?

要创建我运行的订阅:App.room=App.cable.subscriptions.create({channel:"RoomChannel",roomId:roomId},{connected:function(){},disconnected:function(){},received:function(data){return$('#messages').append(data['message']);},speak:function(message,roomId){returnthis.perform('speak',{message:message,roomId:roomI

javascript - 具有多个按钮的 React 表单 - 如何选择一个来处理 onSubmit 事件?

假设我有这个HTML:Output:和这个JS:functionotherAction(e){document.getElementById('output').innerHTML='otherAction';e.preventDefault();}functionsubmit(e){document.getElementById('output').innerHTML='submit';e.preventDefault();}ReactDOM.render(OtherActionSubmit,document.getElementById('container'));其实我们不光说,

javascript - React onClick 函数参数变成 "Proxy"对象

我在我的react层次结构的顶层有一个元素数组,我想用一个带有元素值(字符串)的参数来触发一个onClick函数。然而,当我尝试打印这个值时,打印了一个“Proxy”对象:p>这是我的渲染函数中的代码:returncollapseChoices.map((choice)=>{console.log(choice)return(this.handleCollapse(choice)}>{choice});这里是handleCollapse函数:handleCollapse(mark){console.log(mark);}我确保在构造函数中绑定(bind)thisconstructor(

javascript - 如何使用 Jest 和 Enzyme 在 React 中测试表单提交?无法读取未定义的属性 'preventDefault'

我正在编写一个测试来检查如果提交的登录表单没有数据,是否会显示错误通知组件。describe('Usersignin',()=>{it('shouldfailifnocredentialsareprovided',()=>{constloginComponent=shallow();expect(loginComponent.find('.form-login').length).toBe(1);loginComponent.find('.form-login').simulate('submit');expect(loginComponent.find(Notification).l