React Web应用中shipmentNumber筛选结果与预期不符问题排查

Got it, let's figure out what's going on here! The root issue is that you're using includes() when you actually want to match shipment numbers that start with your input value ("578"), not just contain it anywhere in the string.

Why your current code isn't working #

The includes() method checks if the input substring exists anywhere within the target string. That's why you're getting unexpected results like 7858976578 — if you look closely, the last three characters are "578", so includes("578") returns true for this item, even though it doesn't start with your desired prefix.

Fix: Use startsWith() instead #

To filter for items where shipmentNumber starts with your input value, replace includes() with startsWith():

let tempArry = Data.filter((item) => item.shipmentNumber.startsWith(props.dataToTable));

Edge case to watch out for #

Make sure both item.shipmentNumber and props.dataToTable are string types. If shipmentNumber is stored as a number in your data, convert it to a string first to avoid errors:

let tempArry = Data.filter((item) => 
  item.shipmentNumber.toString().startsWith(props.dataToTable.toString())
);

This will ensure only items where the shipment number begins with "578" (like your expected results: 5788976641, 578897664, 5788976643) are included in the filtered array.

内容的提问来源于stack exchange，提问作者Abhishek Konnur