React native 如何在React Native中删除手风琴中选定的部分

React native 如何在React Native中删除手风琴中选定的部分,react-native,accordion,react-native-collapsible,React Native,Accordion,React Native Collapsible,假设Accordion中有两个部分,我想删除其中任何一个,因此我必须从数组中删除所选数据,这样哪一个是最好的方法?检查我使用react native Collaxiable/Accordion创建的示例 import React, { Component } from "react"; import { StyleSheet, Text, View, Button, SafeAreaView } from "react-native"; import Accordion from "react-

假设Accordion中有两个部分,我想删除其中任何一个,因此我必须从数组中删除所选数据,这样哪一个是最好的方法?

检查我使用
react native Collaxiable/Accordion创建的示例

import React, { Component } from "react";
import { StyleSheet, Text, View, Button, SafeAreaView } from "react-native";
import Accordion from "react-native-collapsible/Accordion";

export default class AccordionView extends Component {
  state = {
    data: [
      {
        title: "Non-Veg Biryanis",
        section:
          "Biryani also known as biriyani, biriani, birani or briyani, is a mixed rice dish with its origins among the Muslims of the Indian subcontinent. This dish is especially popular throughout the Indian subcontinent, as well as among the diaspora from the region. It is also prepared in other regions such as Iraqi Kurdistan."
      },
      {
        title: "Pizzas",
        section:
          "Pizza is a savory dish of Italian origin, consisting of a usually round, flattened base of leavened wheat-based dough topped with tomatoes, cheese, and various other ingredients (anchovies, olives, meat, etc.) baked at a high temperature, traditionally in a wood-fired oven. In formal settings, like a restaurant, pizza is eaten with a knife and fork, but in casual settings, it is cut into wedges to be eaten while held in the hand. Small pizzas are sometimes called pizzettas."
      },
      {
        title: "Drinks",
        section:
          "A drink (or beverage) is a liquid intended for human consumption. In addition to their basic function of satisfying thirst, drinks play important roles in human culture. Common types of drinks include plain drinking water, milk, coffee, tea, hot chocolate, juice, and soft drinks. In addition, alcoholic drinks such as wine, beer, and liquor, which contain the drug ethanol, have been part of human culture for more than 8,000 years."
      },
      {
        title: "Deserts",
        section:
          'A dessert is typically the sweet course that concludes a meal in the culture of many countries, particularly Western culture. The course usually consists of sweet foods but may include other items. The word "dessert" originated from the French word desservir "to clear the table" and the negative of the Latin word service'
      }
    ],
    activeSections: []
  };

  renderHeader = section => {
    return (
      <View style={styles.header}>
        <Text style={styles.headerText}>{section.title}</Text>
      </View>
    );
  };

  renderContent = section => {
    return (
      <View style={styles.content}>
        <Text>{section.section}</Text>
        <Button title="Delete" onPress={this.onHandleDelete} />
      </View>
    );
  };

  updateSections = activeSections => {
    this.setState({ activeSections });
  };

  onHandleDelete = () => {
    /**
     * Get active section index
     */
    let selectedIndex = this.state.activeSections[0];
    let newData = this.state.data;
    /**
     * remove selected object from array
     */
    newData.splice(selectedIndex, 1);
    this.setState({
      data: newData
    });
  };

  render() {
    return (
      <SafeAreaView style={styles.container}>
        <Accordion
          sections={this.state.data}
          activeSections={this.state.activeSections}
          renderHeader={this.renderHeader}
          renderContent={this.renderContent}
          onChange={this.updateSections}
        />
      </SafeAreaView>
    );
  }
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    backgroundColor: "gray",
    paddingTop: 100
  },
  header: {
    backgroundColor: "#F5FCFF",
    padding: 10
  },
  headerText: {
    textAlign: "center",
    fontSize: 16,
    fontWeight: "500"
  },
  content: {
    padding: 20,
    backgroundColor: "#fff"
  }
});
import React,{Component}来自“React”;
从“react native”导入{样式表、文本、视图、按钮、安全区域视图};
从“react native可折叠/手风琴”导入手风琴;
导出默认类AccordionView扩展组件{
状态={
数据:[
{
标题:“非素食Biryanis”,
第节:
“Biryani也被称为biriyani、biriani、birani或briyani,是一种混合米饭,起源于印度次大陆的穆斯林。这道菜在整个印度次大陆以及来自该地区的散居者中特别受欢迎。它也在伊拉克库尔德斯坦等其他地区制作。”
},
{
标题:“比萨饼”,
第节:
比萨饼是一道源自意大利的美味佳肴,通常是由发酵的小麦面团组成的圆形扁平底面,上面覆盖着西红柿、奶酪和各种其他配料(凤尾鱼、橄榄、肉等)在高温下烘烤,传统上是在木制烤箱中烘烤。在正式场合,如餐厅,比萨饼是用刀叉吃的,但在非正式场合,它被切成楔形,拿在手里吃。小比萨饼有时被称为比萨饼。”
},
{
标题:“饮料”,
第节:
“饮料(或饮料)是一种供人类饮用的液体。除了满足口渴的基本功能外,饮料在人类文化中也扮演着重要角色。常见的饮料类型包括普通饮用水、牛奶、咖啡、茶、热巧克力、果汁和软饮料。此外,酒精饮料,如葡萄酒、啤酒和烈性酒,其中含有药物etha诺尔,已经成为人类文化的一部分超过8000年了。”
},
{
标题:“沙漠”,
第节:
在许多国家的文化中,尤其是在西方文化中,甜点通常是结束一顿饭的甜食。甜点通常包括甜食,但也可能包括其他项目。“甜点”一词源于法语单词deservir“为了清理桌子”和拉丁语单词service的否定词
}
],
活动部分:[]
};
renderHeader=区段=>{
返回(
{section.title}
);
};
renderContent=section=>{
返回(
{section.section}
);
};
updateSections=activeSections=>{
this.setState({activeSections});
};
onHandleDelete=()=>{
/**
*获取活动节索引
*/
让selectedIndex=this.state.activeSections[0];
让newData=this.state.data;
/**
*从阵列中删除选定对象
*/
新数据拼接(选择索引1);
这是我的国家({
数据:新数据
});
};
render(){
返回(
);
}
}
const styles=StyleSheet.create({
容器:{
弹性:1,
背景颜色:“灰色”,
加油站:100
},
标题:{
背景颜色:“F5FCFF”,
填充:10
},
标题文字:{
textAlign:“居中”,
尺寸:16,
重量:“500”
},
内容:{
填充:20,
背景颜色:“fff”
}
});
根据您的要求进行更改


希望这对你有帮助。请不要怀疑。

看到问题的标签,我假设您正在使用此组件:。为了帮助您,您能提供一些额外的上下文吗?尝试从阵列中删除所选节时,您是否遇到任何问题?请提供帮助。我被要求解决这个问题。