@solarains/z-components NPM

表单小组件使用说明

一、引入

将组件文件夹zFormItems放入根目录components文件夹中
将vuex文件夹store放入根目录中
在/main.js文件中添加以下代码：

// main.js
import zFormItems from "@/components/zFormItems"; // 表单组件
import store from './store'; //引入vuex
......
Vue.use(zFormItems);
......
const app = new Vue({
	...App,
	store, // Vue实例中添加store
})

// pages.json
"easycom": {
	"autoscan": true,
	"^z-(.*)": "@/components/zFormItems/components/z-$1/index.vue"
}

!!! 在需要使用表单小组件的页面引入mixins:[uni.$pageMixins]

export default {
	mixins:[uni.$pageMixins], // 加入此行
	data() {...},
    methods:{...}
}

二、页面通用属性

组件成功引入后，会将组件的属性通过vuex和mixin的方式放入页面中，直接使用即可。（每日进入页面，将初始化通用属性）

通用属性（通过computed方式引入）

{
 // 客户对象
		customerNo: "",
		customerName: "",
		customerPhoneNo: "",
		customerType: "",

		amount: null, // 数量

		feeTypeName: "",
		feeRules: [], // 收费规则列表
		feeRuleIndex: 0, // 收费规则当前选择index

		discountNum: 100, // 打折的折扣,如：100为不打折，90为打9折

		remarkStr: "", // 备注
	
		choosenBumen: [], // 选择的部门列表
	
		choosenProperty: [], // 选择的摊位列表
	
		// 司机对象
		driverNo: "",
		driverName: "",
		driverId: "",
		driverPhone: "",
	
		temporaryFeeType: "", // 临时服务费收费类型，从数据字典中获取数据
		temporaryFeeName: "", // 临时服务费收费类型名称
}