相关疑难解决方法(0)

是否可以使用setState更新对象的属性？

就像是:

this.state = {
   jasper: { name: 'jasper', age: 28 },
}

我试过了:

this.setState({jasper.name: 'someOtherName'});

还有这个:

this.setState({jasper: {name: 'someothername'}})

第一个是语法错误,第二个什么都不做.有任何想法吗？

我的问题最好通过这个jsfiddle,其代码如下:

var a = 1, b = 'x', c = true;

var d = {a: a, b: b, c: c}; // <--- object literal
var e = [a, b, c];          // <--- array
var f = {a, b, c};          // <--- what exactly is this??

// these all give the same output:
alert(d.a  + ', ' + d.b +  ', ' + d.c );
alert(e[0] + ', ' + e[1] + ', ' + e[2]);
alert(f.a  + ', …

据我所知,React教程和文档毫不含糊地警告说,状态不应该直接变异,并且一切都应该通过setState.

我想明白为什么,确切地说,我不能直接改变状态,然后(在同一个函数中)调用this.setState({})只是为了触发render.

例如:以下代码似乎工作得很好:

const React = require('react');

const App = React.createClass({
    getInitialState: function() {
        return {
            some: {
                rather: {
                    deeply: {
                        embedded: {
                            stuff: 1
                        }}}}};
    },
    updateCounter: function () {
        this.state.some.rather.deeply.embedded.stuff++;
        this.setState({}); // just to trigger the render ...
    },
    render: function() {
        return (
                <div>
                Counter value: {this.state.some.rather.deeply.embedded.stuff}
                <br></br>
                <button onClick={this.updateCounter}>inc</button>
                </div>
        );
    }
});

export default App;

我完全遵循以下约定,但我想进一步了解ReactJS如何实际运行,哪些可能出错或者是否与上述代码不是最佳的.

this.setState文档下的注释基本上确定了两个陷阱:

1. 如果你直接改变状态然后调用this.setState它可能会替换(覆盖？)你所做的突变.我不知道在上面的代码中会发生这种情况.
2. 这setState …

在React中,Component定义如下所示:

class Component<S> {
    state:S;
    setState(state:S):void;
}

你定义一个这样的组件:

interface MyState {
    name: string;
    age: number;
}
class MyComponent extends Component<MyState> { }

现在的问题是,在React API setState中应该使用部分状态对象调用,表示要更新的属性,如下所示:

setState({name: "Aaron"});

请注意,age未声明.我遇到的问题是TypeScript不允许这样做,它给出了一个赋值错误Property 'age' is missing.根据我的理解,这个react.d.ts定义在这个意义上是错误的.但是有解决方案吗？

我试过这个:

setState({name: "Aaron"} as MyState);

但是这会产生相同的错误,即使它在Playground中工作而不会出错.为什么它在游乐场有效？有任何想法吗？