整理报错原因与解决方法

• 情况一：参数格式问题

遍历后台传来的json数组时候遇到这个错误：Uncaught TypeError: Cannot use ‘in’ operator to search for。
原因：一部分浏览器后端传过来的是json对象，但是我们前端是需要Javascript的对象，所以需要做个转换JSON.parse() or jQuery $.parseJSON
解决方法：使用 JSON.parse() 做格式转换

• 情况二：参数个数问题
  这类错误原因就是传参错误，先举个例子：

var obj  = 'hello world';
  if ('a' in obj){
    .....
  }

in 操作后跟的数据类型并不是一个json对象。当对非json对象使用in操作符时，会出现这个错误。

下面是网上找的踩坑实🌰

原文链接：https://zhuanlan.zhihu.com/p/345662010

• 情况三：
  使用select下拉选择框时候报错，以下是报错代码

 <FormItem  label="标签">
        {getFieldDecorator('school')(
            <Select style={{width: '100%'}} placeholder="请选择">
    			{myData.length ? myData.map((item, idx) => (<Option key={idx} value={`${item.id}`}>{item.name}</Option>)) : <Option value=''>请选择...</Option> }
 		    </Select>
        )}
 </FormItem>

解决方法有两种：
法一：
在报错代码块外面加一个DIV标签

 <FormItem  label="标签">
        {getFieldDecorator('school')(
        <div>
            <Select style={{width: '100%'}} placeholder="请选择">
    			{myData.length ? myData.map((item, idx) => (<Option key={idx} value={`${item.id}`}>{item.name}</Option>)) : <Option value=''>请选择...</Option> }
 		    </Select>
 		</div>
        )}
 </FormItem>

但是这样的话getFieldDecorator就取不到对应组件里的值了，变成非受控组件，在提交表单信息的时候Form信息收集不到，所以我们需要在select组件的onChange事件绑定函数：

handleOnChange =(value)=> {
    this.props.form.setFieldsValue({school:value});
 }

法二：
该方法不是在外面加div，而是把三目判断后面的option改为null

<Select style={{width: '100%'}} placeholder="请选择">
    { 
    	myData.length ? myData.map((item, idx) => ( <Option key={idx} value={`${item.id}`}>{item.name}</Option> )) : null 
    }
</Select>

• 情况四：在option渲染之前给value赋值
  官网中说明value表示默认选中的选项
  
  以下是错误代码

let children = List.length && List.map((item) => {
//这里List.length在没取到的时候相当于undefined.length，option肯定不会继续渲染，而select就已经设置value默认选中哪一个或哪几个了，所以会报错
            return <Option name={item.userName} key=item.userId} value={item.userId} >{item.userName}</Option>
        })                              
 <Select
       {..Props}
        value={value}
        multiple
        style={{ width: '376px', marginRight: '10px' }}
       onChange={this.handleChange}
      optionFilterProp="children"
      labelInValue
>
      {children}
 </Select>

let children = List.length && List.map((item) => {…})
//这里List.length在没取到的时候相当于undefined.length，option肯定不会继续渲染，而select就已经设置value默认选中哪一个或哪几个了，所以会报错
纠正之后的代码

let children =  List&&List.map((item) => {
2             return <Option name={item.userName} key={item.userId} value={item.userId} >{item.userName}</Option>
3         }

原文链接 https://www.cnblogs.com/yeujuan/p/15642949.html

• 情况五：
  这个是因为获取不到对应字段的值所以报了这种错误
  原文链接附上：https://stackoverflow.com/questions/63660311/cannot-use-in-operator-to-search-for-d-in-undefined