检查一个字符串是否包含另一个字符串React Native。

Question

我将尝试过滤一个数据数组，如下所示：

let data = 
[
   {
    "approval": "TPED",
    "manufacturer": "Chesterfield"
   },
   {
    "approval": "BV",
    "manufacturer": "Faber"
   }
]

let approvalVariable = "TP"
let filteredData = data.filter(x => x.approval.includes(approvalVariable))

console.log(filteredData)

如果approvalVariable是"TP"，我希望新的数组如下：

[
   {
    "approval": "TPED",
    "manufacturer": "Chesterfield"
   },
]

当我这样做时，它可以正常工作:

let filteredData = data.filter(x => x.approval == approvalVariable)

但是当我尝试：

x.approval.includes(approvalVariable)

我遇到了一个错误，提示x.approval.includes不是一个对象。

我曾经使用.includes()方法让它正常工作过，但现在出了些问题。

如果有帮助的话，将不胜感激。

  componentWillMount() {
    this.fetchData();
  }

 fetchData = async () => {
   var fireBaseResponse = firebase.database().ref();
   fireBaseResponse.once('value').then(snapshot => {
     let data1 = [];
     let approval = this.props.navigation.state.params.approval
     let comments = this.props.navigation.state.params.comments
     let designStandard = this.props.navigation.state.params.designStandard
     let diameter = this.props.navigation.state.params.diameter
     let h2Compatible = this.props.navigation.state.params.h2compatible
     let inletThread = this.props.navigation.state.params.inletThread
     let manufacturer = this.props.navigation.state.params.manufacturer
     let specificationNumber = this.props.navigation.state.params.specificationNumber
     let testPressure = this.props.navigation.state.params.testPressure
     let waterCapacity = this.props.navigation.state.params.waterCapacity
     let workingPressure = this.props.navigation.state.params.workingPressure


    snapshot.forEach(item =>{
        const temp = item.val();
        data1.push(temp);
        return false;
      });
////////Filter Method/////////
      if(approval == '') {
        console.log("good")
      }
      else {
        data1 = data1.filter(x => x.approval.includes(approval))
      }
      if(waterCapacity == '') {
        console.log("good")
      }
      else {
        data1 = data1.filter(x => x.waterCapacity == waterCapacity)
      }
      if(designStandard== '') {
        console.log("good")
      }
      else {
        data1 = data1.filter(x => x.designStandard == designStandard)
      }
      if(diameter == '') {
        console.log("good")
      }
      else {
        data1 = data1.filter(x => x.diameter == diameter)
      }
      if(inletThread == '') {
        console.log("good")
      }
      else {
        data1 = data1.filter(x => x.inletThread == inletThread)
      }
      if(workingPressure == '') {
        console.log("good")
      }
      else {
        data1 = data1.filter(x => x.workingPressure == workingPressure)
      }
      if(comments == '') {
        console.log("good")
      }
      else {
        data1 = data1.filter(x => x.comments == comments)
      }

      if(manufacturer == '') {
        console.log("good")
      }
      else {
        data1 = data1.filter(x => x.manufacturer == manufacturer)
      }
      if(testPressure == '') {
        console.log("good")
      }
      else {
        data1 = data1.filter(x => x.testPressure == testPressure)
      }

      if(specificationNumber == '') {
        console.log("good")
      }
      else {
        data1 = data1.filter(x => x.specificationNumber == specificationNumber)
      }
      if(h2Compatible == '') {
        console.log("good")
      }
      else {
        data1 = data1.filter(x => x.h2Compatible == h2Compatible)
      }


/////////////////////Filter Method//////////////////

      this.setState({data: data1});

    });
  }
  render(){
    var {navigate} = this.props.navigation;
    let {params} = this.props.navigation.state;
    return(
    <ViewContainer>
        <ScrollView>
         <FlatList
                data = {this.state.data}
                keyExtractor = {(x, i) => i}
                renderItem ={({item}) =>
                    <Text style = {styles.itemText}>
                        Approval: {item.approval} | Manufacturer: {item.manufacturer} | Specification Number: {item.specificationNumber} |
                        H2 Compatible: {item.h2Compatible} | Diameter: {item.diameter} | Water Capacity: {item.waterCapacity} |
                        Inlet Thread: {item.inletThread}{"\n"}
                    </Text>
                }
            />
        </ScrollView>
            <View style ={styles.footer}>
                <TouchableOpacity style ={styles.footerButton} onPress = { () => navigate("ValveSearchScreen")}>
                    <Text style ={styles.footerButtonText}>SEARCH</Text>
                </TouchableOpacity>
            </View>
    </ViewContainer>

    )
  }
}

- paulgio

---

代码对我来说运行良好。你一定在其他地方犯了错误。 - Get Off My Lawn

几天前对我来说也很好用，但出于某种原因，我现在遇到了一个错误，它说有一个未处理的 Promise 拒绝。 - paulgio

是的，这与你在使用 Promise 的其他代码有关。 - Get Off My Lawn

现在我们有两个不同的错误，而且这两个错误都与所显示的代码无关... 请添加一个最小化、完整和可验证的示例来展示实际的问题。 - Andreas

@paulgio：如果可能的话，建议您在snack.expo.io上设置代码。 - Isaac

Answer 1

问题在于它正在搜索名为“includes”的数组对象中的属性。显然找不到它，所以它会给我一个警告说该属性不存在。为了解决这个问题，我将该行更改为：

let filteredData = data.filter(x => String(x.approval).includes(approvalVariable));

希望这能帮助将来其他人，不然你可能会像我一样花上一周的时间试图弄清楚而没有任何帮助。

- paulgio

---

一直卡在同样的错误上。但是与其遇到一个错误，我遇到了一个死循环。只要我添加了String（x.variable）。包含，一切都好了！感谢您提供答案的帖子。 - Jean-François Handfield