model中使用条件运算符

model中使用条件运算符

本文介绍了在v-model中使用条件运算符?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我有一个vue组件,显示一个表单,其中填充了要编辑的所选项目中的项目。现在我不想使用第二种形式来创建新项目。目前,我使用v-model自动填充和更新项目,这显然更新了对象。我不能在这样使用条件运算符吗?

I have a vue component that shows a form populated with items from a selected item to edit. Now I don't want to have to use a second form for creating a new item. At the moment I auto populate and update the item with v-model which obviously updates the object. Am I not able to use conditional operators in this like so?

<form @submit.prevent>
  <div class="field">
    <label class="label">Job Title</label>

    <p class="control">
      <input type="text" class="input" placeholder="Job title" v-model="experiences[editIndex].title ? experiences[editIndex].title : ''" />
    </p>
  </div>
</form>


推荐答案

您可以使用 v-model ,但你不能给你的 v-model 一个字符串,就像你在你的例子中尝试一样。

You can use conditional operators with v-model, but you can't give v-model a string like you're attempting in your example.

我不会使用相同的表单进行编辑和创建(可能是首选)。我会将表单作为自己的组件,然后再创建两个用于编辑和创建的表单组件。

I wouldn't use the same form for editing and creating (might be preference). I would make the form its own component and then make two additional form components for editing and creating.

但是,如果你真的想要处理每个输入的 v-model 指令中的逻辑,你需要在三元运算符的最后部分给它一个变量。这样的事情:

However, if you really want to handle the logic in each input's v-model directive, you would need to give it a variable in the last part of the ternary operator. Something like this:

v-model="experiences[i].title ? experiences[i].title : newExperience.title"

这篇关于在v-model中使用条件运算符?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!

08-02 01:06