Question

我有一个搜索栏，它正在从服务器获取响应；我有一个Flatlist，它在另一个类中，并且包含来自previos source.data的数据。所以我希望当我单击搜索结果按钮时，我的答案将设置在flatlist上数据源。并希望该屏幕将再次重新呈现这是我的代码

这是我的导航器类...可以基于json对象制作标签

class Customers extends React.Component {
  state = {
      subscriptions: [{}],
      dataSource:[],isLoading:true,searchbar:true,search:''
    }
  }

  componentDidMount(){
    let data = new FormData();
    data.append('methodName',       'items_list');

    Sendshoppinapi(data).then((responseJson)=>{
      this.setState({subscriptions: responseJson.details_app});
    })
     }

  render() {
    const screens = {}
    const { navigation } = this.props
    const { subscriptions } = this.state
    let selectedSubscription = navigation.getParam('subscription')

    subscriptions.forEach((subscription) => {
      if (selectedSubscription === undefined) {
        selectedSubscription = subscription
      }
      screens[subscription.catgeory_name] = {
        screen: () => (
          <CustomersTab
            subscription={subscription}
            topNavigation={navigation}
              customers={subscription.items_list}
          />
        ),
      }
    })

    const TabNavigation = createMaterialTopTabNavigator(screens, {
      initialRouteName: selectedSubscription.category_name,
        tabBarOptions: {
          activeTintColor: 'white',  // Color of tab when pressed
          inactiveTintColor: '#818388',pressColor: 'gray',
          indicatorStyle: {backgroundColor:'#009fdd',padding:2
          },
        },
    })

    return (



        <View style={{ flex: 1 }}>
          { subscriptions.length > 1 && (
            <TabNavigation />
          )}
          { subscriptions.length === 1 && (
            <CustomersTab
              subscription={subscriptions[0]}
              customers={subscriptions[0].customers}

            />
          )}
        </View>

    )
  }
}

这是我的主要课程，显示渲染平面列表

  render() {
    const { topNavigation, subscription,customers } = this.props
    return (

        <View style={{backgroundColor:'#e4e9ee',padding:3,flex:1}}>
          <FlatList data={this.props.customers}
            horizontal={false}
            numColumns={2}

这是我的搜索功能，我可以在其中获取结果并希望显示在平板列表项目中

searchcart=()=>{
    let data = new FormData();
    data.append('methodName',       'filter');
    data.append('item_name',       this.state.search);

    Sendshoppinapi(data).then((responseJson)=>{
      console.log(responseJson);
      this.setState({subscriptions: responseJson.data});

      console.warn(responseJson);
      //  global.search = responseJson.data;
      <CustomersTab
        customers = {responseJson.data}
       />
    })
     }

从另一个类更改平面列表中的数据源

0 个答案: