React - существует ли аналогичный способ объявления свойств состояния?

Question

Таким образом, в новом ES6 Реагировать путь, видя такие вещи очень часто:

render() 

    const { thing1, thing2, thing3 } = this.props 

    ...other stuff 

Есть ли сопоставимый метод для государственных свойств, которые могут или не могут существовать?

Это становится очень утомительно использовать переменные состояния, как это:

<h1>{this.state && this.state.title ? this.state.title : ''}</h1> 

Answer 1

Это на самом деле называется назначением деструктурирующего, что это особенность ES6 вы можете прочитать об этом здесь: https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Operators/Destructuring_assignment

Вы можете легко просто сделать, к любому объекту:

const { title } = this.state 

Answer 2

Ну, this.state всегда ненулевым, если йо u дайте ему значение во время строительства. И вы обычно можете упростить тест названия простым ||: this.state.title || "".

Вот полный пример:

class Foo extends React.Component { 
    static propTypes = { 
     thing1: PropTypes.string, 
     thing2: PropTypes.string.isRequired, 
    }; 

    // initialize state during construction 
    state = { title: undefined, a: 1, b: 2 }; 

    render() { 
     const { thing1, thing2 } = this.props; 
     const { title, a, b } = this.state; 

     return (
      <div> 
       {thing1 && <div>{thing1}</div>} 
       <div>{thing2}</div> {/* isRequired so will never be null */} 
       <div>{title || ""}</div> 
       {a && <div>{a}</div>} {/* only render if a is truthy */} 
       <div>{b || "no b"}</div> {/* render "no b" if b not set */} 
      </div> 
     ); 
    } 
}