可以在反應組件中擁有自己的屬性嗎？

class VideoList extends Component { 
    constructor(props) { 
    super(props); 

    this.videoList = props.videos.map((video) => { 
     return <VideoListItem video={video} /> 
    }) 
    } 

    render() { 
    return (
     <ul className="collection"> 
      {this.videoList} 
     </ul> 
    ) 
    } 
}

我只是想知道是否允許我在反應組件中擁有自己的屬性。可以在反應組件中擁有自己的屬性嗎？

來源

2017-06-15 hytm

是有意義的有這樣的屬性，但只有當你不想渲染。既然你正在渲染它，它可能會更有意義，把它放在狀態。因爲如果您更新屬性 - 就像現在一樣，您可能無法在UI上看到新值。

您可以在放什麼用下面的圖片作爲指導，而不是把狀態：

它是由丹·阿布拉莫夫創建如果我沒看錯的。

來源

2017-06-15 07:15:52

感謝您的指導！這個指南可以幫助我很多:) – hytm

也許，我設置'this.videoList'的東西是我可以從道具計算出來的，所以它不應該設置爲狀態。 – hytm

嗯，可以在你的反應組件中擁有自己的屬性。沒有人會責怪你。

但是不要忘記用propType發貨，它會爲您節省很多時間（通過類型檢查來捕獲錯誤）。

參考：https://facebook.github.io/react/docs/typechecking-with-proptypes.html

來源

2017-06-15 07:13:15

我想你是指將videoList存儲到組件實例？

你可以存儲的狀態的影片名單，但似乎不必要做到這一點，我將簡化VideoList是一個stateless functional component呈現的傳遞中作爲道具的影片名單：

const VideoList = ({ videos }) => (
    <ul className="collection"> 
    {videos.map(video => <VideoListItem video={video} />)} 
    </ul> 
);

的官方文檔實際上並沒有解釋上面的語法，但它基本上是一個沒有狀態的React組件的語法糖，它只接受props。 ({ videos })語法爲ES6 Destructuring。 VideoList組件接收props，並且此語法將props.videos作爲組件上的變量提取。

此外，在渲染項目列表時，您應爲每個VideoListItem提供某種唯一的key，例如，

<VideoListItem key={video.id} video={video} />

來源

2017-06-15 07:33:04 Michael

可以在反應組件中擁有自己的屬性嗎？

回答

相關問題