javascript - 如何将新的费用项目添加到列表顶部？

Question

当用户输入他们的费用时，我需要在列表顶部添加一个新的费用项目。我已经在另一个名为“输入表单”的组件中有一个正在工作的 onPress 函数，但我似乎无法将新费用添加到顶部。每次我添加新费用时，它只是替换最高费用，而不是在顶部创建新费用。这是我的“费用项目”组件，当用户输入他们的费用时，我试图在其中呈现新费用组件。

const data = [
    {
      id: 1,
      title: "Old Navy",
      category: "Miscellaneous",
      price: "$23.50",
    },
    {
      id: 2,
      title: "Apple Store",
      category: "Miscellaneous",
      price: "$1223.00",
    },
    {
      id: 3,
      title: "SU Stocks",
      category: "Investments",
      price: "$4200.00",
    },
   ];

  const title = useSelector(selectTitle);
  const price = useSelector(selectPrice);
  const category = useSelector(selectCategory);

//User entered Data
  const enteredData = {
    id: Math.random().toString(),
    title: title.disTitle,
    price: price.disPrice,
    category: category.disCategory,
  };

  const expense = enteredData;

  const [expenseItems, setExpenseItems] = useState([data]);

  useEffect(() => {
    setExpenseItems([expense, ...expenseItems]);
  }, [title, price, category]);

  return (
   <View>
      {
        (title.disTitle,
        price.disPrice,
        category.disCategory ? <NewExpense /> : null)
      }
      {expenseItems.map(({ id }) => {
        <NewExpense key={id}/>;
      })}
    </View>
  );
};

标签： javascriptreact-native