SOURCE

console 命令行工具 X clear

                    
>
console
new Vue({
  el: "#app",
  data: {
		options: {
      formData: {
        city: '',
        citys: ''
      },
			formItem: [
        {
          type: 'select',
          key: 'city',
          children: [
            {
              label: '天津',
              value: 'tianjin'
            },
            {
              value: 'shenzhen',
            	disabled: true,
            	label: '深圳'
            },
            {
              label: '韶关',
              value: 'shaoguan'
            },
          ],
          events: {
            'on-change': () => {
              console.log('这是一个测试')
            }
          }
        },
        {
          type: 'select',
        	key: 'citys',
          children: [
            {
        			type: 'optionGroup',
              label: '城市',
        			// 子项可以省略type: 'option'
              // 并且提供了简写方式 可以直接写props的属性 而不用像下面这样使用
              // props: {
              //		value: 'tj',
        			//		label: '天津'
              // }
        			children: [
        				{
        					value: 'tj',
        					label: '天津'
        				}
      				]
            },
            {
              value: 'shenzhen',
            	disabled: true,
            	label: '深圳'
            },
            {
              label: '韶关',
              value: 'shaoguan'
            },
        		{
        			type: 'optionGroup',
              label: '县',
        			children: [
        				{
        					value: 'xf',
        					label: '新丰'
        				}
      				]
            },
          ]
        },
      ]
    }
  }
})
<link rel="stylesheet" href="//unpkg.com/view-design/dist/styles/iview.css">
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.min.js"></script>
<script src="//unpkg.com/view-design/dist/iview.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/vue-form-maker/dist/vue-form-maker.js"></script>
<div id="app">
  <vue-form-maker :options="options" />
</div>
#app {
  padding: 10px 20px;
}