<template v-for="(item) in showQueryColumns" >
    <el-col :key="item.prop" :xs = "24" :sm = "12" :md="12" :lg = "12" :xl = "6">
        <!--字符串類型-->
        <el-form-item v-if="item.type==='string'" :label="$t(item.i18n)" :prop="item.prop">
             <el-input v-model="form[item.prop]" clearable></el-input>
        </el-form-item>
    </el-col>
 </template>

// 普通輸入框
<input type="text" v-model="value1">

// 處理模板屬性
function processAttrs(el) {
? var list = el.attrsList;
? var i, l, name, rawName, value, modifiers, syncGen, isDynamic;
? for (i = 0, l = list.length; i < l; i++) {
? ? name = rawName = list[i].name; // v-on:click
? ? value = list[i].value; // doThis
? ? if (dirRE.test(name)) { // 1.針對指令的屬性處理
? ? ? ···
? ? ? if (bindRE.test(name)) { // v-bind分支
? ? ? ? ···
? ? ? } else if(onRE.test(name)) { // v-on分支
? ? ? ? ···
? ? ? } else { // 除了v-bind，v-on之外的普通指令
? ? ? ? ···
? ? ? ? // 普通指令會在AST樹上添加directives屬性
? ? ? ? addDirective(el, name, rawName, value, arg, isDynamic, modifiers, list[i]);
? ? ? ? if (name === 'model') {
? ? ? ? ? checkForAliasModel(el, value);
? ? ? ? }
? ? ? }
? ? } else {
? ? ? // 2. 普通html標簽屬性
? ? }
? }
}

// 添加directives屬性
function addDirective (el,name,rawName,value,arg,isDynamicArg,modifiers,range) {
? ? (el.directives || (el.directives = [])).push(rangeSetItem({
? ? ? name: name,
? ? ? rawName: rawName,
? ? ? value: value,
? ? ? arg: arg,
? ? ? isDynamicArg: isDynamicArg,
? ? ? modifiers: modifiers?? ?// 模板中添加的修飾符，如：.lazy、.number、.trim
? ? }, range));
? ? el.plain = false;
? }

// AST
{
? directives: {
? ? {
? ? ? rawName: 'v-model',
? ? ? value: 'value',
? ? ? name: 'v-model',
? ? ? modifiers: undefined
? ? }
? }
}

// directives render字符串的生成
? function genDirectives (el, state) {
? ? // 拿到指令對象
? ? var dirs = el.directives;
? ? if (!dirs) { return }
? ? // 字符串拼接
? ? var res = 'directives:[';
? ? var hasRuntime = false;
? ? var i, l, dir, needRuntime;
? ? for (i = 0, l = dirs.length; i < l; i++) {
? ? ? dir = dirs[i];
? ? ? needRuntime = true;
? ? ? // 對指令ast樹的重新處理
? ? ? var gen = state.directives[dir.name];
? ? ? if (gen) {
? ? ? ? // compile-time directive that manipulates AST.
? ? ? ? // returns true if it also needs a runtime counterpart.
? ? ? ? needRuntime = !!gen(el, dir, state.warn);
? ? ? }
? ? ? if (needRuntime) {
? ? ? ? hasRuntime = true;
? ? ? ? res += "{name:\"" + (dir.name) + "\",rawName:\"" + (dir.rawName) + "\"" + (dir.value ? (",value:(" + (dir.value) + "),expression:" + (JSON.stringify(dir.value))) : '') + (dir.arg ? (",arg:" + (dir.isDynamicArg ? dir.arg : ("\"" + (dir.arg) + "\""))) : '') + (dir.modifiers ? (",modifiers:" + (JSON.stringify(dir.modifiers))) : '') + "},";
? ? ? }
? ? }
? ? if (hasRuntime) {
? ? ? return res.slice(0, -1) + ']'
? ? }
? }

unction model (el,dir,_warn) {
? ? warn$1 = _warn;
? ? // 綁定的值
? ? var value = dir.value;
? ? var modifiers = dir.modifiers;
? ? var tag = el.tag;
? ? var type = el.attrsMap.type;
? ? {
? ? ? // 這里遇到type是file的html，如果還使用雙向綁定會報出警告。
? ? ? // 因為File inputs是只讀的
? ? ? if (tag === 'input' && type === 'file') {
? ? ? ? warn$1(
? ? ? ? ? "<" + (el.tag) + " v-model=\"" + value + "\" type=\"file\">:\n" +
? ? ? ? ? "File inputs are read only. Use a v-on:change listener instead.",
? ? ? ? ? el.rawAttrsMap['v-model']
? ? ? ? );
? ? ? }
? ? }
? ? //組件上v-model的處理
? ? if (el.component) {
? ? ? genComponentModel(el, value, modifiers);
? ? ? // component v-model doesn't need extra runtime
? ? ? return false
? ? } else if (tag === 'select') {
? ? ? // select表單
? ? ? genSelect(el, value, modifiers);
? ? } else if (tag === 'input' && type === 'checkbox') {
? ? ? // checkbox表單
? ? ? genCheckboxModel(el, value, modifiers);
? ? } else if (tag === 'input' && type === 'radio') {
? ? ? // radio表單
? ? ? genRadioModel(el, value, modifiers);
? ? } else if (tag === 'input' || tag === 'textarea') {
? ? ? // 普通input，如 text, textarea
? ? ? genDefaultModel(el, value, modifiers);
? ? } else if (!config.isReservedTag(tag)) {
? ? ? genComponentModel(el, value, modifiers);
? ? ? // component v-model doesn't need extra runtime
? ? ? return false
? ? } else {
? ? ? // 如果不是表單使用v-model，同樣會報出警告，雙向綁定只針對表單控件。
? ? ? warn$1(
? ? ? ? "<" + (el.tag) + " v-model=\"" + value + "\">: " +
? ? ? ? "v-model is not supported on this element type. " +
? ? ? ? 'If you are working with contenteditable, it\'s recommended to ' +
? ? ? ? 'wrap a library dedicated for that purpose inside a custom component.',
? ? ? ? el.rawAttrsMap['v-model']
? ? ? );
? ? }
? ? // ensure runtime directive metadata
? ? //?
? ? return true
? }

function genDefaultModel (el,value,modifiers) {
? ? var type = el.attrsMap.type;
? ? // v-model和v-bind值相同值，有沖突會報錯
? ? {
? ? ? var value$1 = el.attrsMap['v-bind:value'] || el.attrsMap[':value'];
? ? ? var typeBinding = el.attrsMap['v-bind:type'] || el.attrsMap[':type'];
? ? ? if (value$1 && !typeBinding) {
? ? ? ? var binding = el.attrsMap['v-bind:value'] ? 'v-bind:value' : ':value';
? ? ? ? warn$1(
? ? ? ? ? binding + "=\"" + value$1 + "\" conflicts with v-model on the same element " +
? ? ? ? ? 'because the latter already expands to a value binding internally',
? ? ? ? ? el.rawAttrsMap[binding]
? ? ? ? );
? ? ? }
? ? }
? ? // modifiers存貯的是v-model的修飾符。
? ? var ref = modifiers || {};
? ? // lazy,trim,number是可供v-model使用的修飾符
? ? var lazy = ref.lazy;
? ? var number = ref.number;
? ? var trim = ref.trim;
? ? var needCompositionGuard = !lazy && type !== 'range';
? ? // lazy修飾符將觸發(fā)同步的事件從input改為change
? ? var event = lazy ? 'change' : type === 'range' ? RANGE_TOKEN : 'input';
? ? var valueExpression = '$event.target.value';
? ? // 過濾用戶輸入的首尾空白符
? ? if (trim) {
? ? ? valueExpression = "$event.target.value.trim()";
? ? }
? ? // 將用戶輸入轉(zhuǎn)為數(shù)值類型
? ? if (number) {
? ? ? valueExpression = "_n(" + valueExpression + ")";
? ? }
? ? // genAssignmentCode函數(shù)是為了處理v-model的格式，允許使用以下的形式： v-model="a.b" v-model="a[b]"
? ? var code = genAssignmentCode(value, valueExpression);
? ? if (needCompositionGuard) {
? ? ? // ?保證了不會在輸入法組合文字過程中得到更新
? ? ? code = "if($event.target.composing)return;" + code;
? ? }
? ? // ?添加value屬性
? ? addProp(el, 'value', ("(" + value + ")"));
? ? // 綁定事件
? ? addHandler(el, event, code, null, true);
? ? if (trim || number) {
? ? ? addHandler(el, 'blur', '$forceUpdate()');
? ? }
? }
function genAssignmentCode (value,assignment) {
? // 處理v-model的格式，v-model="a.b" v-model="a[b]"
? var res = parseModel(value);
? if (res.key === null) {
? ? // 普通情形
? ? return (value + "=" + assignment)
? } else {
? ? // 對象形式
? ? return ("$set(" + (res.exp) + ", " + (res.key) + ", " + assignment + ")")
? }
}

// ?添加value屬性
addProp(el, 'value', ("(" + value + ")"));
// 綁定事件屬性
addHandler(el, event, code, null, true);

function genData$2 (el, state) {
? var data = '{';
? // 已經(jīng)分析過的genDirectives
? var dirs = genDirectives(el, state);
? // 處理props
? if (el.props) {
? ? data += "domProps:" + (genProps(el.props)) + ",";
? }
? // 處理事件
? if (el.events) {
? ? data += (genHandlers(el.events, false)) + ",";
? }
}

"_c('input',
{
? directives:[{
? ? ?name:"model",
? ? ?rawName:"v-model",
? ? ?value:(message),
? ? ?expression:"message"
? ?}],
? ?attrs:{"type":"text"},
? ?domProps:{"value":(message)},
? ?on:{
? ? ?"input":function($event){
? ? ? ?if($event.target.composing)
? ? ? ? ?return;message=$event.target.value
? ? ?}
? ?}
})"

<input type="text" :value="message" @input="(e) => {this.message = e.target.value}">

var child = {
? ? template: '<div><input type="text" :value="value" @input="emitEvent">{{value}}</div>',
? ? methods: {
? ? ? emitEvent(e) {
? ? ? ? this.$emit('input', e.target.value)
? ? ? }
? ? },
? ? props: ['value']
? }
?new Vue({
? ?data() {
? ? ?return {
? ? ? ?message: 'test'
? ? ?}
? ?},
? ?components: {
? ? ?child
? ?},
? ?template: '<div id="app"><child v-model="message"></child></div>',
? ?el: '#app'
?})

<child :value = "message" @input="function(e){message = e}"</child>