Javascript 如何使用html输入元素值初始化Vue data（）

我正在尝试使用renderedinput标记中的值初始化Vuedata（）。 我知道可以使用Vue中的v-model=“[data key here]”“从data（）中输入标记值以获取数据。是否有任何方法可以使用Vue中输入标记值的数据初始化数据（）中的数据

代码示例

导出默认值{
数据（）{
返回{
汽车名称：“路虎揽胜”，
汽车重量：零
}
}
}

据我所知，DOM将基于vuejs数据模型呈现。为了设置输入字段的值，您可以初始化VueJs数据（在您的情况下为“car_weight”），并省去输入元素上的“value”标记。稍后，当您更改输入时，VueJs数据将更新以反映这一点，因此：

<template>
  <input v-model="car_name">
  <input v-model="car_weight">
</template>
<script>
  ...
  data () {
    return {
      car_name: "Holden",
      car_weight: 40
    }
  }
</script>

...
数据（）{
返回{
车名：“霍尔顿”，
汽车重量：40
}
}

---

。。将为您提供初始值，当您在浏览器中更改输入时，数据将被更新。

在Vue.js v-model指令中提供了双向绑定。所以在您的例子中，“car_name”是输入标记和data（）的相同数据。你可以在这里了解更多 处理输入值到数据的其他方法，例如，监听输入事件：

<input @input="onInput" /> // tag in template

onInput(event){ // handler for event
this.inputValue = event.target.value; // setting your value with input value
}

//模板中的标记
onInput（事件）{//事件的处理程序
this.inputValue=event.target.value；//使用输入值设置值
}

---

在引擎盖下，v-model和我编写的代码的行为是一样的。关于这一点，你可以阅读这篇文章

你能分享一个代码示例来详细说明你想问什么吗？@Keith，我正在寻找一种方法，在脚本标记中使用输入标记中的值=40来初始化car_weight，你能在vue中的数据（）初始化之前访问html输入元素吗？如果不是（我怀疑），那么正如您所提到的，输入标签值（使用v-model=“car\u weight”）可以来自数据。我不明白你需要怎么做/为什么不这样做。。。要执行所需操作，请从输入中删除“value”标记，并将该值放入Vue data:car_weight:40中的数据结构中。我理解您的意思，但我的逻辑是，输入值最初是使用父组件中的方法设置的，然后我希望该方法中的任何一个方法初始化子组件（表单）数据或输入值以一致地初始化数据。我正在寻找实现这一目标的方法，我不知道这是否可能。