状态更改时 React-Native-Component 不呈现

Question

我在平面列表中显示更多并显示更少的功能，但按下的状态没有按预期工作。当我设置状态值时，当状态改变其值时，组件不会被呈现。

我的构造函数设置如下

this.state = {
            accList: [],
            expanded: false,
            expandedText: "Show More"
        }

在 componentdidmount() 中，我正在更新 accList 的值，如下所示

componentDidMount = () => {
      this.setState({
accList:[{
    "customer_name": "Shubhangi J Thakur",
    "message":"Hello"
},
{
    "customer_name": "Arthur S Campbell",
    "message":"Hello_World"
},
{

    "customer_name": "Susan R Brill",
    "message":"hellow"
}]
});

    }

我已经在 render() 中定义了平面列表，如下所示

<FlatList
     onScroll={this.handleScroll}
     data={this.state.accList}
       renderItem={this.renderItem}
        keyExtractor={this._keyExtractor}
    />

    renderItem = ({ item, index }) => (
        <Card style={style.cardLayout} key={index}>
            <CardItem header>

              <Text>{item.customer_name}</Text>

            </CardItem>
            {this.seemorefunctionality(item)}

        </Card>
    );


    seemorefunctionality = (item) => {

              return <View>

            {this.state.expanded ? this.expandedView(item) :null}
//To view Show More and Show Less Text
                <TouchableOpacity onPress={this.expandedText}>
                 <Text> {this.state.expandedText}</Text>
                </TouchableOpacity>
              </View>

            }
          } 



expandedText = () => {
        console.log('Setting the expanded text value', this.state.expanded)
         if (this.state.expanded) {
           this.setState({
             expandedText: "Show More"
           });
         }
         else {
           this.setState({
             expandedText: "Show Less"
           });
         }
         value=!this.state.expanded
         this.setState({
           expanded: value

         });
       }


expandedView = (item) => {
        return   <View>
             {item.map((obj, index) => {
               return (
                 <View key={index} >
                 <Text>{obj.message}</Text>
                 </View>
               )
             })}
           </View>

当我单击 this.state.expandedText 值时，我们在控制台中看到它的值发生了变化，但它没有反映在视图中，当 this.state.expanded 设置为 true 时，expandView 也没有被呈现。
在 View 中 this.state.expandedText 的值总是显示 Show More 而我可以在控制台中看到该值正在更改为 Show more and Show Less on click

Answer 1

要重新呈现平面列表，您必须添加 extraData={this.state} 作为 https://facebook.github.io/react-native/docs/flatlist

上的提及