## demoForm
介绍demoForm的使用
:::demo
```html
 
<template>
  <dxx-card title="表单">
    <dxx-form :data="params" :rules="formRules" title-align="right" title-width="180" :title-colon="true" @submit="fromSubmit">
      <dxx-form-item field="field1" title="行政相对人名称1" span="12">
        <dxx-input v-model="params.field1" :item-render="{}" type="text" placeholder="请输入" maxlength="1000"></dxx-input>
      </dxx-form-item>
      <dxx-form-item field="field2" title="行政相对人类别	" span="12">
        <dxx-input v-model="params.field2" :item-render="{}" type="text" placeholder="请输入" maxlength="1000"></dxx-input>
      </dxx-form-item>
      <dxx-form-item field="field3" title="行政相对人代码(统一社会信用代码)" span="12">
        <dxx-input v-model="params.field3" :item-render="{}" type="text" placeholder="请输入" maxlength="1000"></dxx-input>
      </dxx-form-item>
      <dxx-form-item field="field4" title="行政相对人代码(工商注册号)	" span="12">
        <dxx-input v-model="params.field4" :item-render="{}" type="text" placeholder="请输入" maxlength="1000"></dxx-input>
      </dxx-form-item>
      <dxx-form-item field="field5" title="法定代表人" span="12">
        <dxx-input v-model="params.field5" :item-render="{}" type="text" placeholder="请输入" maxlength="1000"></dxx-input>
      </dxx-form-item>
      <dxx-form-item field="field6" title="行政许可决定文书名称" span="12">
        <dxx-input v-model="params.field6" :item-render="{}" type="text" placeholder="请输入" maxlength="1000"></dxx-input>
      </dxx-form-item>
      <dxx-form-item field="field7" title="行政许可决定文书号" span="12">
        <dxx-input v-model="params.field7" :item-render="{}" type="text" placeholder="请输入" maxlength="1000"></dxx-input>
      </dxx-form-item>
      <dxx-form-item field="field8" title="许可类别" span="12">
        <dxx-select v-model="params.field8" placeholder="请输入">
          <dxx-option value="1" label="选项1"></dxx-option>
          <dxx-option value="2" label="选项2"></dxx-option>
          <dxx-option value="3" label="选项3"></dxx-option>
        </dxx-select>
      </dxx-form-item>
      <dxx-form-item field="field9" title="许可证书名称" span="12">
        <dxx-input v-model="params.field9" :item-render="{}" type="text" placeholder="请输入" maxlength="1000"></dxx-input>
      </dxx-form-item>
      <dxx-form-item field="field10" title="许可编号	" span="12">
        <dxx-input v-model="params.field10" :item-render="{}" type="text" placeholder="请输入" maxlength="1000"></dxx-input>
      </dxx-form-item>
      <dxx-form-item field="field11" title="许可内容" span="12">
        <dxx-input v-model="params.field11" :item-render="{}" type="text" placeholder="请输入" maxlength="1000"></dxx-input>
      </dxx-form-item>
      <dxx-form-item field="field12" title="许可决定日期" span="12">
        <dxx-input v-model="params.field12" :item-render="{}" type="text" placeholder="请输入" maxlength="1000"></dxx-input>
      </dxx-form-item>
      <dxx-form-item field="field13" title="许可机关统一社会信用代码" span="12">
        <dxx-input v-model="params.field13" :item-render="{}" type="text" placeholder="请输入" maxlength="1000"></dxx-input>
      </dxx-form-item>
      <dxx-form-item field="field14" title="数据来源单位" span="12">
        <dxx-input v-model="params.field14" :item-render="{}" type="text" placeholder="请输入" maxlength="1000"></dxx-input>
      </dxx-form-item>
      <dxx-form-item field="field15" title="数据来源备注" span="24">
        <dxx-textarea v-model="params.field15" :autosize="{minRows: 3}" :item-render="{}" placeholder="请输入"></dxx-textarea>
      </dxx-form-item>
      <dxx-form-item field="null" align="center" span="24">
        <dxx-button html-type="submit" size="default" type="primary" class="mr10">
          提交
        </dxx-button>
        <dxx-button html-type="button" size="default" type="default">
          返回
        </dxx-button>
      </dxx-form-item>
    </dxx-form>
  </dxx-card>
</template>

<script>
export default {
  //页面引用的组件
  components: {

  },
  //父页面传递参数
  props: {},
  data() {
    return {
      "params": {
        "field1": "广东德信行信用管理有限公司",
        "field2": "法人及非法人组织",
        "field3": "914406060553941239",
        "field4": "440681000401234",
        "field5": "向远望",
        "field6": "有限责任公司变更登记",
        "field7": "顺监核设通字【2017】第1781183152号",
        "field8": "1",
        "field9": "有限责任公司变更登记",
        "field10": "1781183152",
        "field11": "企业征信业务、企业及个人信用管理咨询服务、信息科技研发、信息...",
        "field12": "2017-10-10",
        "field13": "11440600MB2C922887",
        "field14": "佛山市顺德区市场监督管理局",
        "field15": "企业征信业务、企业及个人信用管理咨询服务、信息科技研发、信息..."
      },
      "formRules": {
        "field1": [
          {
            "required": true,
            "message": "请输入"
          }
        ],
        "field2": [
          {
            "required": true,
            "message": "请输入"
          }
        ],
        "field3": [
          {
            "required": true,
            "message": "请输入"
          }
        ],
        "field4": [
          {
            "required": true,
            "message": "请输入"
          }
        ],
        "field5": [
          {
            "required": true,
            "message": "请输入"
          }
        ],
        "field6": [
          {
            "required": true,
            "message": "请输入"
          }
        ],
        "field7": [
          {
            "required": true,
            "message": "请输入"
          }
        ],
        "field8": [
          {
            "required": true,
            "message": "请输入"
          }
        ],
        "field9": [
          {
            "required": true,
            "message": "请输入"
          }
        ],
        "field10": [
          {
            "required": true,
            "message": "请输入"
          }
        ],
        "field11": [
          {
            "required": true,
            "message": "请输入"
          }
        ],
        "field12": [
          {
            "required": true,
            "message": "请输入"
          }
        ],
        "field13": [
          {
            "required": true,
            "message": "请输入"
          }
        ],
        "field14": [
          {
            "required": true,
            "message": "请输入"
          }
        ],
        "field15": [
          {
            "required": true,
            "message": "请输入"
          }
        ]
      }
    }
  },
  //监控计算变量
  computed: {
  },
  //监听
  watch: {},
  //dom加载完执行
  mounted() { },
  //页面的构造方法
  created() {

  },
  //页面的自定义方法
  methods: {

    /**@fromSubmit 表单提交*/
    fromSubmit() {

      //仅仅只是演示，请删除
      setTimeout(() => {
        this.$XModal.message({ message: '保存成功', status: 'success' })
      }, 1000)

      /* ajax请求
          this.$http({
            method: "post",
            url: this.apiHost + "/demo/demo/demo",
            data: this.params,
          })
          .then(res => {
            if (res.data.code == "200") {
              //console.log(res.data.data);
            }
          }) */

    }
  }
};
</script>

<style>
</style>
```
:::