javascript - VueJs 有像 React 这样的受控和非受控组件的概念吗？

Question

React 有受控和非受控的概念 https://reactjs.org/docs/uncontrolled-components.html成分。

哪里受控是在 react 模型中工作的组件，状态在虚拟 dom 中进行跟踪。

不受控制的在虚拟 dom 之外进行管理。

由于 Vue 也适用于虚拟 dom，是否有错误的获取元素的方法(例如，您可以使用 document.queryBySelector 或 classList.add，就像使用 vanillajs 操作 dom 一样)？

Answer 1

像您说的那样使用 vanilla JS 定位元素并没有错，但这不是最佳实践，Vue 可能会拒绝任何外部试图弄乱 DOM 的尝试。
当我需要从 DOM 中获取特定元素并使用普通方法对其进行操作时，我将始终在 Vue 结构内进行操作，而不是从单独的文件或脚本中进行操作。我会这样做或这样做的一些变体:

new Vue({
  ...,
  methods:{
    setClass() {
      let elem1 = document.querySelector("#elem1");
      elem1.classList.add("yourClass");
    }
  },
  mounted() {
    let elem2 = document.querySelector("#elem2");
  }
}

如果您想添加或删除类，我建议您使用 Vue 原生的类绑定(bind)选项。如果您正在处理表单，那么 v-model 是您的最佳选择。