jjzjj

Per-Component

全部标签

javascript - 是否可以将 var styles = StyleSheet.create 从 React.component 分离到不同的脚本中?

是否可以在ReactNative中将varstyles=StyleSheet.create从React.component分离到不同的脚本中? 最佳答案 这是可能的。只需使用此模式创建一个js文件:'usestrict';varReact=require('react-native');varmyStyles=React.StyleSheet.create({style1:{},style2:{})}module.exports=myStyles;然后在您的组件js中使用require来使用该样式表,例如假设你的样式js文件被命名为

javascript - react + Apollo : GraphQL errors array not passed into component

根据这些Apollodocs,设置all的error-policy应该使GraphQL响应的errors数组可用于我的Apollo包装的React组件“所以[my]UI可以使用它们。”我的应用程序是通用的,所以我使用此策略很重要,这样错误就不会阻止应用程序完全呈现。问题是,即使我的浏览器开发工具在服务器响应中显示了errors数组,我也无法在我的React组件的props中访问它。同样,props.data.error始终未定义。这是为什么?//ComponentimportReactfrom'react';import{graphql}from'react-apollo';impor

javascript - 如何解决 Component should be written as a pure function error in eslint-react?

constHeader=React.createClass({contextTypes:{router:React.PropTypes.object.isRequired,},render(){return(AB);},});我使用eslint-config-airbnb检查上面的代码,它向我显示一条错误消息,例如Componentshouldbewrittenasapurefunction。那么如何将上面的组件改成纯函数呢?感谢您的帮助。 最佳答案 当你有一个“哑”组件(没有内部状态、生命周期方法等)时,你可以将它写成一个简单的j

javascript - 为什么 <Route component={Menu}/> 而不是 <Menu/>?

我的/About中有一个包含路线的子菜单。这个子菜单称为AboutMenu并出现在/About下的所有页面,例如=>/About/Company和/About/Info。练习示例显示与activeStyle={match.isExact&&selectedStyle}>我刚用过并添加了exact改为我的AboutMenu链接。为什么要使用而不是仅仅渲染?exportconstAboutMenu=(props)=>{return(CompanyHistoryVision)}关于部分constAbout=(props)=>{return({/*OR?*/})}exportdefaultAb

javascript - 使用 Styled-Components,如何在 Styled Component 之外设置颜色数组?

theme.js-我有一个Styled-Components主题,其中包含我应用的所有颜色变化。constcolors={purples:{60:'#AEA',50:'#GSA',},blues:{20:'#asd',5:'#fasd',}...然后我有一个UI组件,我需要在其中按特定顺序定义一组颜色:importReactfrom'react';constcolors=['#GSA','#AEA','#asd','#fasd','#AEA'];我稍后使用此colors数组根据状态找到要在我的组件中使用的正确颜色:constgetBackgroundColor=({currentPos

javascript - 如何避免 React Component 不必要的重新渲染

我一直在学习React16.8的新特性。我相信React的PureComponent应该自动避免不必要的重新渲染操作。在以下示例中,App本身是一个无状态组件。我用useState维护两个状态对象text和nested:{text}.有3个测试。前2个测试有效。无论我改变多少次状态,都不需要重新渲染操作。现在,第三个测试尝试设置text的状态具有相同的字符串值,但引用不同。我不希望重新渲染任何内容,但实际上,将被重新渲染。我应该使用某种内存技巧来避免吗?我觉得归档它的代码太多了。程序员必须非常小心才能编写高质量的React代码。..classHeadlineextendsReact.P

javascript - react / Hook : prevent re-rendering component with a function as prop

假设我有:constAddItemButton=React.memo(({onClick})=>{//Goalistomakesurethisgetsprintedonlyonceconsole.error('ButtonRendered!');returnAddItem;});constApp=()=>{const[items,setItems]=useState([]);constaddItem=()=>{setItems(items.concat(Math.random()));}return({items.map(item=>{item})});};每当我添加一个项目时,重新呈

javascript - knockout : Invoking function of parent component from child component

问题:我正在尝试构建一个小部件仪表板。每个小部件的标题上都有一个删除按钮。单击此按钮时,相应的小部件必须消失。我是如何设计的:我有两个knockout组件。我的小部件列表:VO将有一个小部件对象的observableArray。我的小部件:VO将在小部件中显示详细信息。注意:为简单起见,我只用数字替换了小部件对象。ko.components.register('my-widget-list',{viewModel:function(params){varself=this;self.values=ko.observableArray([10,20,30,40,50]);self.del

javascript - 失败的 Prop 类型 : Invalid prop `component` of type `object` supplied to `Route` , 预期 `function`

我刚刚将我的React应用程序更新到16.6.0并将react-scripts更新到2.0.3以开始使用lazy并且在按照官方文档上的示例进行操作时出现此错误:失败的prop类型:提供给Route的object类型的无效propcomponent,预期的function忽略它,一切似乎都在工作,除了控制台中的这个错误。这是我的一些代码://importshere...constDecks=lazy(()=>import('./pages/Decks'));...classAppextendsComponent{...render(){return(}>...);}...我在这里做错了什

javascript - JsHint - 隐藏此消息 : ES5 option is now set per default

我正在使用gulp-jshint,下面的错误消息很烦人:ES5optionisnowsetperdefault如何删除它? 最佳答案 它只是告诉您这是默认设置,因此您无需将其添加为选项。查看.jshintrc文件并删除"es5":true。http://jslinterrors.com/es5-option-is-now-set-per-default 关于javascript-JsHint-隐藏此消息:ES5optionisnowsetperdefault,我们在StackOverfl