<input v-model='inputval"> 请问怎么获取 input 获得焦点的value, 和 失去焦点的value

获取 input 获得焦点的 value，可以使用以下代码：

document.querySelector('input').addEventListener('focus', function() {
  console.log(this.value);
});

失去焦点的 value，可以使用以下代码：

document.querySelector('input').addEventListener('blur', function() {
  console.log(this.value);
});

相关问题

<el-card shadow="never"> <el-divider content-position="left"><h3>创建&编辑邮件模板</h3></el-divider> <el-form label-position="top"> <el-form-item label="邮件名称" prop="name" style="width: 200px"> <el-input v-model="modeData.name"></el-input> </el-form-item> <el-form-item label="模板名称" prop="subject" style="width: 200px"> <el-input v-model="modeData.subject"></el-input> </el-form-item> <el-form-item label="语言" prop="language"> <el-select v-model="modeData.language" placeholder="请选择"> <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value"> </el-option> </el-select> </el-form-item> <el-form-item label="启动/禁用" prop="enable"> <el-switch v-model="modeData.enable" active-text="禁用" inactive-text="启动"> </el-switch> </el-form-item> <el-form-item label="模板配置" prop="value"> <PiEditor v-model="modeData.value" placeholder="请输入" :height="400" /> </el-form-item> <el-button @click="onSubmit">保存</el-button> </el-form> </el-card>请为这段代码布局

可以使用以下代码布局：

<template>
  <el-card shadow="never">
    <el-divider content-position="left">
      <h3>创建&编辑邮件模板</h3>
    </el-divider>
    <el-form label-position="top">
      <el-form-item label="邮件名称" prop="name">
        <el-input v-model="modeData.name" style="width: 200px" />
      </el-form-item>
      <el-form-item label="模板名称" prop="subject">
        <el-input v-model="modeData.subject" style="width: 200px" />
      </el-form-item>
      <el-form-item label="语言" prop="language">
        <el-select v-model="modeData.language" placeholder="请选择">
          <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value" />
        </el-select>
      </el-form-item>
      <el-form-item label="启动/禁用" prop="enable">
        <el-switch v-model="modeData.enable" active-text="禁用" inactive-text="启动" />
      </el-form-item>
      <el-form-item label="模板配置" prop="value">
        <PiEditor v-model="modeData.value" placeholder="请输入" :height="400" />
      </el-form-item>
      <el-form-item>
        <el-button type="primary" @click="onSubmit">保存</el-button>
      </el-form-item>
    </el-form>
  </el-card>
</template>

这样可以使表单更加美观，且易于使用。

<div v-for="(item, index) in parameters" :key="index"> <el-form-item :label="item.value + item.remark"> <el-input v-if="item.type == 0" v-model=""></el-input> <el-radio-group v-model="processSelfTestEditForm.parameter" v-if="item.type == 1" > <el-radio label="合格" size="large">合格</el-radio> <el-radio label="不合格" size="large">不合格</el-radio> </el-radio-group> </el-form-item> </div> 动态渲染时怎么拿到每一个input 的v-model

你可以通过绑定动态的v-model，将每个input的v-model绑定到一个对象中，然后在提交表单时，获取这个对象的值。具体代码如下：

<el-form :model="formData" ref="form">
  <div v-for="(item, index) in parameters" :key="index">
    <el-form-item :label="item.value + item.remark">
      <el-input v-if="item.type == 0" v-model="formData[item.key]"></el-input>
      <el-radio-group v-model="formData[item.key]" v-if="item.type == 1">
        <el-radio label="合格" size="large">合格</el-radio>
        <el-radio label="不合格" size="large">不合格</el-radio>
      </el-radio-group>
    </el-form-item>
  </div>
</el-form>

在这个例子中，我们使用了一个对象 `formData` 来存储每一个input的值。我们可以在 `v-model` 中绑定 `formData[item.key]`，这里的 `item.key` 代表每一个input对应的key。在提交表单时，我们可以通过 `this.$refs.form.validate()` 方法获取到 `formData` 对象，并将其传递给后端。