草庐IT

SliverList组件

全部标签

javascript - React.js - 为所有组件方法使用属性初始值设定项

我正在做一个ReactNative项目,我正在为React组件使用ES6类。由于通过ES6类定义的React组件没有自动绑定(bind),React团队recommends将ES7属性初始值设定项与箭头函数相结合以创建相同的效果。为了保持一致并防止与this-binding混淆,我对所有组件方法都使用了ES7属性初始值设定项:classFooextendsReact.Component{constructor(props){super(props);...}componentDidMount=()=>{...};bar=()=>{...};render=()=>{...};}我想知道-

javascript - 实例 Angular 2 组件两次

我正在尝试学习Angular2,所以我制作了一些helloworld示例。这是我的代码:boot.tsimport{bootstrap}from'angular2/platform/browser'import{AppComponent}from'./app.component'import{DataService}from'./app.dataservice'bootstrap(AppComponent,[DataService]);index.html...Loading...Loading......app.component.tsimport{Component}from'an

javascript - 为什么react中的组件需要大写?

这个问题在这里已经有了答案:ReactJScomponentnamesmustbeginwithcapitalletters?(6个答案)关闭3年前。因此,当您用小写首字母声明一个组件时,它不会出现,也不会引发错误。当您将组件名称大写时,它确实有效。这样实现的是什么?为了避免与现有的html元素发生冲突,或者这是一个错误?vartest=React.createClass({render:function(){return(Test);}});varScreen=React.createClass({render:function(){return();}});当我将test更改为Te

javascript - 在 Web 组件中扩展元素时, "is"语法有何意义?

在网络组件中,要注册一个元素,您只需键入:varXFoo=document.registerElement('x-foo',{prototype:Object.create(HTMLElement.prototype)});要创建一个元素,您可以执行以下操作之一:varxFoo=newXFoo();document.body.appendChild(xFoo);varxFoo=document.createElement('x-foo')document.body.appendChild(xFoo);这一切都很好,花花公子。当您谈论扩展现有元素时,问题就开始了。varXFooButto

javascript - 如何在同一个 react 组件中使用本地状态和 redux 存储状态?

我有一个显示联系人的表格,我想按名字对联系人进行排序。联系人数组来自redux存储,然后通过Prop来,但我希望本地状态保存这些联系人的排序方式,因为它是本地UI状态。我如何实现这一目标?到目前为止,我已将联系人放入componentWillReceiveProps但由于某些原因,它在更改时没有收到Prop。每次reduxstore状态改变时如何更新本地状态?constTable=React.createClass({getInitialState(){return{contacts:[]}},componentWillReceiveProps(){this.setState({con

javascript - 测试使用 setInterval 或 setTimeout 的 Angular2 组件

我有一个相当典型、简单的ng2组件,它调用一个服务来获取一些数据(轮播项目)。它还使用setInterval每隔n秒自动切换UI中的轮播幻灯片。它工作得很好,但在运行Jasmine测试时我收到错误:“无法在异步测试区内使用setInterval”。我尝试在this.zone.runOutsideAngular(()=>{...})中包装setInterval调用,但错误仍然存​​在。我原以为将测试更改为在fakeAsync区域中运行可以解决问题,但随后我收到一条错误消息,指出不允许从fakeAsync测试区域中进行XHR调用(这确实有意义)。如何同时使用服务发出的XHR调用和时间间隔,

javascript - 是否可以在自定义 react 组件上设置类名?

这个问题在这里已经有了答案:ApplyingclassName/onClick/onChangenotworkingonCustomReactComponent(2个答案)关闭5年前。假设我有一个像这样的简单组件:classSimpleComponentextendsReact.Component{render(){returnSometext}}是否可以将className添加到SimpleComponent或者这是否仅限于HTMLDOM元素?例如:varmySimpleComponent=我想这样做的原因是我可以像这样在我的自定义组件中设置元素的样式:.myComp>p{backg

javascript - 如何防止 react 重新渲染整个组件?

我从here中改编了以下组件定义如下所示。但是,与示例不同的是,每次我在其上移动鼠标时,我的组件都会重新呈现。重新渲染非常明显:有人知道为什么会这样吗?importReact,{Component}from'react';import{PieChart,Pie,Sector}from'recharts';import{Segment,Header,Dimmer,Loader,Grid}from'semantic-ui-react';constrenderActiveShape=(props)=>{constRADIAN=Math.PI/180;const{cx,cy,midAngle,

javascript - Angular 2 同一页面上有多个组件

我正在使用app.component.ts文件中的Angular2快速入门代码。文件看起来像这样:import{Component}from'angular2/core';@Component({selector:'app',template:`TitleHere'})exportclassAppComponent{}这按预期工作。我想做的是在同一个页面上添加另一个组件...所以我尝试了这个:import{Component}from'angular2/core';import{ComponentTwo}from'angular2/core';@Component({selector:

javascript - 如何使用 React 和 Redux 测试带有嵌套容器的组件?

由于我正在处理的应用程序的复杂性,我决定使用嵌套的redux容器,而不是将操作作为prop向下传递给子组件。然而,这已被证明在渲染OuterContainer时对单元测试有问题。与jsdom结合mocha,chai和sinon.这是View结构的人为示例:哪里OuterContainer&InnerContainer用连接包裹。例如:exportconnect()()运行测试时,我得到的错误是:InvariantViolation:Couldnotfind"store"ineitherthecontextorpropsof"Connect(Component)".Eitherwrapt