shiningjason/react-quick-tutorial

TodoList.defaultProps 設定問題

Closed this issue · 2 comments

寫法如下, 請問為何沒有作用???

TodoList.defaultProps = {
  todos :  [
    {
      id: 0,
      title: 'Item 111',
      completed: false
    }
  ]
};

Hi @taiyan33:

我不太確定你其他程式是否有出錯,這一段看起來是沒錯的。

另外寫了一個範例提供你參考:
https://jsbin.com/wohedezixi/edit?html,js,console,output

希望有幫助到你!

若無設定一個全域 const todos = [];
則下句語法會出錯,
todoCount={todos.filter((todo) => !todo.completed).length}

這裡應假設TodoApp 預設值為 todos, 供子物件使用

不知如此修改是否更符合題意??

[出處:這裡]

class TodoApp extends React.Component {
  render() {
    // 5. 將待辦數量和資料分別遞給 TodoHeader 和 TodoList
    const {appName} = this.props;
    return (
      <div>
        <h1>{appName}</h1>
        <TodoHeader
          title="我的待辦清單"
          username="Jason"
          todoCount={mytodos.filter((todo) => !todo.completed).length}  這裡這裡這裡這裡
        />
        <InputField placeholder="新增待辦清單" />
        <TodoList  />
      </div>
    );
  }
}