【问题标题】:How to remove duplicates from array in react native如何在本机反应中从数组中删除重复项
【发布时间】:2020-03-25 14:19:06
【问题描述】:

下面的代码显示了重复数据的数组,但我需要数组中的唯一数据。 我尝试了很多步骤,但我找不到解决方案:

请看下图接收到的重复输出

JS 文件

export default class App extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      storage: [],

    };
    this.renderData = this.renderData.bind(this);
  }
  renderData({ item, index }) {
  const datas = Array.from(new Set(item.category)); 
    return (
      <View>
        <Text>{datas}</Text>
      </View>
    );
  }
  componentDidMount() {
    fetch('http://myjsonpage', {
      method: 'post',
      headers: { 
        Accept: 'application/json',
        'Content-Type': 'application/json',},
      body: JSON.stringify({
        token: 'XXXXXX',
      }),
    }).then(response => { response.json().then(responseData => {
        if (responseData.status === 1) {
            this.setState({ datas:responseData.data}) ;
        } else {
          this.setState({ storage: [] });
        }
      });});}
  render() {
    return (
      <View style={styles.continer}>
        <View style={styles.heading}>
          <Text style={styles.font}> Most Common Categories </Text>
        </View>
        <View style={styles.item}>
          <FlatList data={this.state.datas} renderItem={this.renderData} />
        </View>
      </View>
    );}}

提前谢谢..!!

【问题讨论】:

  • 您可以使用 Set:this.setState({datas: [...new Set(responseData.data)]})
  • 我尝试了很多步骤 - 比如?
  • 提供您收到的示例数据格式并发布您尝试过的内容
  • @Bravo 是文字,而不是代码?

标签: javascript arrays reactjs react-native


【解决方案1】:

有很多方法可以从数组中删除重复项,请使用 Sets 删除重复项。

const data = ['Renewal', 'Subscriptions', 'Subscriptions', 'Subscriptions', 'Renewal', 'Renewal']

const unique = new Set(data);

const uniqueData = [...unique]; // array

const data = ['Renewal', 'Subscriptions', 'Subscriptions', 'Subscriptions', 'Renewal', 'Renewal']

const uniqueData = [...new Set(data)];

console.log(uniqueData);
if (responseData.status === 1) {
   this.setState({ datas: [...new Set(responseData.data)] }) ;
 } else {
   this.setState({ storage: [] });
 }

【讨论】:

  • 数组item.categoryresponseData.data是哪一个?
猜你喜欢
  • 1970-01-01
  • 2020-02-23
  • 2019-05-20
  • 2017-06-21
  • 2022-09-27
  • 2022-01-03
  • 2012-10-04
  • 2014-06-07
相关资源
最近更新 更多