vue-dm

$3

+ 订单地址模型
``typescript
// addressList.ts
import { DataModel, Model } from 'vue-dm';

@Model
export default class AddressList extends DataModel {
public setName(name: string): void {
this.data.forEach((item) => {
item.name = name;
});
}
public static filterAddressList(
data: TypeOrder.AddressList[],
list: string[]
): TypeOrder.AddressList[] {
return data.filter((item) => list.indexOf(item.code) > -1);
}
}
`

+ 订单表单模型
`typescript
// orderFormData.ts
import { reactive } from 'vue';
import { Model, ChildModel, DataModel } from 'vue-dm';
import AddressList from './addressList';
/**
* 订单表单模型
*/
@Model
export default class OrderFormData extends DataModel {
/**
* 地址模型
*/
@ChildModel('address_list', AddressList)
public addressListModel!: AddressList;
/**
* 初始化表单数据
* @returns 初始化表单数据
*/
protected __init(): TypeOrder.FormData {
return reactive({
code: '',
name: '',
id: 0,
address_list: [
{ name: '测试', code: '1' },
{ name: '测试1', code: '2' },
],
});
}
/* 初始化表单数据 /
public initFormData() {
this.data = this.__init();
}
/**
* 通过详情数据生成表单数据
* @param detailData
* @returns
*/
public setFormDataByDetail(detailData: any) {
Object.assign(this.data, {
code: detailData.code,
name: detailData.name,
id: detailData.id,
});
}
}

`


+ 页面组件
`html


``