更新记录

1.0.5（2021-12-09）

r控件事件修正

1.0.4（2021-12-09）

修改事件重复提交问题

1.0.3（2021-12-09）

修正了事件触发

平台兼容性

thirdlucky-data-input

DataFormItem 数据驱动的表单项，在表单组件中使用

组件名：thirdlucky-data-input 代码块： uDataFormItem

本组件是基于uni-app基础组件uni-easy-input的封装。本组件要解决问题包括：

1. 数据绑定型组件：给本组件绑定一个data，会自动渲染一组候选内容。再以往，开发者需要编写不少代码实现类似功能

注意事项 为了避免错误使用，给大家带来不好的开发体验，请在使用组件前仔细阅读下面的注意事项，可以帮你避免一些错误。

• 组件需要依赖 sass 插件 ，请自行手动安装
• 本组件为数据驱动，目的是快速投入使用，只可通过 style 覆盖有限样式，不支持自定义更多样式

安装方式

本组件符合easycom规范，HBuilderX 2.5.5起，只需将本组件导入项目，在页面template中即可直接使用，无需在页面中import和注册components。

如需通过npm方式使用uni-ui组件，另行文档：https://ext.dcloud.net.cn/plugin?id=55

基本用法

设置 columns 属性后，组件会通过数据渲染出对应的内容

<template>
    <view>
        <uni-forms :modelValue="formData" :rules="rules">
            <uni-forms-item class="form-item" v-for="(column, index) in columns" :key="index" :label="column.info">
                <thirdlucky-data-input ref="`item${index}`" :column="column" v-model="formData[column.name]"></thirdlucky-data-input>
            </uni-forms-item>
        </uni-forms>
    </view>
</template>

<script>
    export default {
        props: {
            formData: {
                type: Object,
                required: false,
                default() {
                    return {};
                }
            },
            rules: {
                type: Object,
                required: false,
                default() {
                    return {};
                }
            },
            columns: {
                type: Array,
                required: true,
                default() {
                    return [];
                }
            },
        },
    };
</script>

API

DataTable Props

Localdata Options

组件示例

点击查看：https://codechina.csdn.net/thirdlucky/test.git