如何在 React Native 中解决这个小问题？ “；”预期的

Question

我是编程初学者所以不要笑我，你能帮我解决这个问题吗？为什么会出现错误这里的问题是什么？ P.S 我知道问题出在我身上，但无论如何.. 看截图 Screenshot of problem

Answer 1

到目前为止您所写的内容等同于

const SearchScreen = ({navigator}) => {
  const [searchKey, setSearchKey] = useState("");

  const renderItem = ...
};

Answer 2

欢迎来到社区。很高兴看到你有勇气寻求解决方案。关于您面临的问题，有一件事非常重要，那就是基于 class 的组件和基于功能的组件的不同。这里有link可以帮忙：

React 中函数式组件和 Class 组件的区别：

https://www.geeksforgeeks.org/differences-between-functional-components-and-class-components-in-react

现在看完文章（上面提到的），你找到解决办法了吗？

试试这个（稍后谢谢我）：

import React, { Component } from "react";

class SearchScreen extends React.Component{

 constructor(props){
    super(props);
    this.state={
        searchKey : "",
    };
}

一定要把这个组件彻底做成class基础组件。

作为初学者，我建议学习基于函数的组件、OOP（面向对象编程）的基础知识以及“this”关键字的功能。是的，一直保持这种勇气。

Answer 3

很难判断，因为组件的顶部未包含在您的屏幕截图中（参见Please do not upload images of code/data/errors when asking a question.）

然而，您似乎有一个功能组件，您正试图将其视为基于 class 的组件。

如果这是一个功能组件，您可能会使用 use state 挂钩声明状态。要做到这一点，看起来像：

const [searchKey, setSearchKey] = useState('')

然后组件变成这样：

export function SearchScreen() {
  const [searchKey, setSearchKey] = useState("");
  
  const filterData = DATA.filter((item) => {
    item.title.includes(searchKey)
  }) // removed the comma here

  return <SafeAreaView>...jsx here...</SafeAreaView>
};

如果这是一个基于 class 的组件，那么您需要这样的东西：

class SearchScreen extends React.Component {
  constructor() {
    this.state = { searchKey: '' }
  }

  render() {
    const filterData = DATA.filter((item) => {
      item.title.includes(this.state.searchKey)
    }) // removed the comma here

    return <SafeAreaView>...jsx here...</SafeAreaView>
  }
}

如何在 React Native 中解决这个小问题？ “；”预期的

How to solve this litle problem in React Native? ";" expected

reactjs

react-native

syntax-error