React类组件里使用setState时发现了出现了以下问题：
state = {
mealsData: [
{
id: '1',
title: '汉堡包',
desc: '百分百纯牛肉配搭爽脆酸瓜洋葱粒与美味番茄酱经典滋味让你无法抵挡！',
price: 12,
img: '/img/meals/1.png',
amount: 0
},
{
id: '2',
title: '双层吉士汉堡',
desc: '百分百纯牛肉与双层香软芝，加上松软面包及美味酱料，诱惑无人能挡！',
price: 20,
img: '/img/meals/2.png',
amount: 0
},
{
id: '3',
title: '巨无霸',
desc: '两块百分百纯牛肉，搭配生菜、洋葱等新鲜食材，口感丰富，极致美味！',
price: 24,
img: '/img/meals/3.png',
amount: 0
}, {
id: '4',
title: '麦辣鸡腿汉堡',
desc: '金黄脆辣的外皮，鲜嫩幼滑的鸡腿肉，多重滋味，一次打动您挑剔的味蕾！',
price: 21,
img: '/img/meals/4.png',
amount: 0
}, {
id: '5',
title: '板烧鸡腿堡',
desc: '原块去骨鸡排嫩滑多汁，与翠绿新鲜的生菜和香浓烧鸡酱搭配，口感丰富！',
price: 22,
img: '/img/meals/5.png',
amount: 0
}, {
id: '6',
title: '麦香鸡',
desc: '清脆爽口的生菜，金黄酥脆的鸡肉。营养配搭，好滋味的健康选择！',
price: 14,
img: '/img/meals/6.png',
amount: 0
}, {
id: '7',
title: '吉士汉堡包',
desc: '百分百纯牛肉与香软芝士融为一体配合美味番茄醬丰富口感一咬即刻涌现！',
price: 12,
img: '/img/meals/7.png',
amount: 0
}
]}
filterMeals = keyWord => {
let newMeals = this.state.mealsData.filter(item => item.title.indexOf(keyWord) !== -1 || item.desc.indexOf(keyWord) !== -1 )
console.log(newMeals)
this.setState( { mealsData: newMeals })
console.log(this.state.mealsData);
}
当keyWord = '汉'时newMeals = [] ,this.state.mealsData = [] ,然后我把this.setState注释掉以后newMeals.length = 4，这是为啥呢
是不是多次输入关键字造成的。你这直接把数据源给改了。应该是设置 mealsDataOrigin=[]这是数据源不能变
mealsData = mealsDataOrigin.filter()。不然一个数据源的话，后面直接就空了
详解：根据js的执行代码的顺序，异步的操作会在正常js执行完之后继续执行，所以当执行到**cconsole.log()**的时候，this.state.country并没有修改，所以控制台打印总是少一位。