200217&菜鸡前端工作卡壳梳理汇总

卡壳的地方(不能直接写的都算)

• 思路不清；
• 还需要想一想；
• 还需要搜搜；
• 还需要找参考的地方
• …

eventStore和eventBanner配合时的自动刷新处理机制是如何的？

比较复杂，待思考后重新梳理

如何从异步接口中获取数据？

(接口中嵌套异步请求，然后拿到数据。区别于一次性的eventStore和eventBanner的banner提示)

PUT的传参，是往params还是data里面更新值

data，

除此之外:

get是params,delete也是params

post和put一样。都是data

如何从antd的Form中取值

直接 const {formItem1, formItem2} = this.prop.form，不行

需要通过 this.props.form.getFieldValue(“formItem1”) 单个去取。

或者用 validateFieldsAndScroll 去处理。

this.props.form.validateFieldsAndScroll((err, values) => {})

url配置中，如何设置参数

getSummary(id) { return `xxx/${id || this.id}`; },

一个注意点: 方法名后面的()和 { 之间，没有:

装饰器模式&ES6的对象字面形式语法和简洁写法

网络失败: TypeError: Converting circular structure to JSON --> starting at object with constructor 'Object' | property 'opts' -> object with constructor 'Object' --- property 'data' closes the circle ->

 _.set(opts, "data", { ...opts.data, ...this.templateParams });//正确

 _.set(opts, "data", {opts, ...this.templateParams});//错误

不会再store里面写一个list接口

写几块内容，每块写啥不清。

• 1)方法名&入参
• 2)装饰器(url, method)
• 3)入参处理
• 4)回调函数处理(
  • 1)_.each遍历data.records回写id到key，用于antd的table组件
  • 2)赋值给datalist，
  • 3)return res(用于更新total))
• 5)http异步实体(注意要return)

_.set 的写法报错(422) - ValidError: xxId Failed to convert value of type 'java.lang.String' to required type 'java.lang.Long'; nested exception is java.lang.NumberFormatException: For input string: "undefined"

_.set(opts, "params.xxId", this.xxId);

错写为:

_.set("params.xxId", this.xxId);

url配置中，带参数的，始终访问时配置不上参数

this.xx，这个this指代的是 store。 xx必须和 store中监测的xx 变量名一致才行。

注意: 每个return 后面记得带分号。以及去掉参数后面拼接的多余分号。尤其是去分号，不然会在url中多 “%20”

xx(id) { return `xx/${id || this.params.id}`; },

id的值，是如何赋值的，还未搞清楚 => 装饰器模式&属性描述符&this绑定

antd的table有数据，但就是不展示，提示 No Data

陷进去了，还是 dataList赋值的问题。 9里的4)，赋值给dataList，

具体代码是

this.dataList = data.records

而不是

data.dataList = data.records;//(让store使用，而不是回参)

判断antd的table组件的嵌套表格是否展开的逻辑

还得看 f1 的扩展组件迁移。

习惯缺少:组件优化，扩大业务范畴。eg，不仅让 f1 可用，让 f2 也可用，甚至其他 => 放之四海而皆准

组件嵌套的时候，出现super语法 类型错误。不清楚改怎么改了

缓兵之计:不用组件嵌套。

onExpandedRowsChange是干啥的？

onExpandedRowsChange 展开的行变化时触发 Function(expandedRows)

onExpand 点击展开图标时触发 Function(expanded, record)

onClick={() => this.handleMenuClick({ key: "spot"}, record)}箭头函数的this指向

dom的箭头函数的第一个参数，指的是 当前dom