一、背景
在js文件 abc.js 获取到 abc.vue 的this
作用：abc.js如果要使用 axios 等场景，这个时候需要使用到 this。
二、sendThis 方法实现
2.1、abc.js定义 sendThis 方法
let vm = null export const sendThis = ( _this )=> { vm = _this; };
2.2、abc.vue 在created() 声明周期 传递 this
2.2.1、引入sendThis方法
import { sendThis } from '@/const/abc.js'
2.2.2、created() 生命周期传递this
created() { sendThis(this) }
2.3、在abc.js中使用
export const form = [ { key: 'name', title: '请输入名字', type: 'select', options: [], value: '', attr: { placeholder: '请输入名字', filterable: true, remote: true, 'remote-method': (query) => { const cur = vm.form.find((item) => item.key === 'name'); vm.$axios({ method: 'post', url: url, data: { name: query, }, }) .then((res) => {}) } } ]
经过测试，成功。
三、abc.vue 赋值给对应的属性
3.1、abc.js
export const form = [ { key: 'name', title: '请输入名字', type: 'select', options: [], value: '', attr: { placeholder: '请输入名字', filterable: true, remote: true, 'remote-method': '' } ]
3.2、abc.vue 引入 form
import { form } from '@/const/abc.js'
3.3、赋值
created() { this.form[0].attr['remote-method'] = this.remoteMethod; }, method: { remoteMethod(){ // do something } }
经过测试成功。
四、.call() 方法
4.1、abc.js
export const form = () => [ { key: 'name', title: '请输入名字', type: 'select', options: [], value: '', attr: { placeholder: '请输入名字', filterable: true, remote: true, 'remote-method': (query) => { const cur = vm.form.find((item) => item.key === 'name'); vm.$axios({ method: 'post', url: url, data: { name: query, }, }) .then((res) => {}) } } ]
4.2、abc.vue 引入 form
import { form } from '@/const/abc.js'
4.3、 调用call方法
data(vm){ return { formData: this.form.call(vm, vm) } }
这时候我们把this传递了过去，配置文件中可以使用this了。
五、欢迎交流指正，关注我，一起学习。
