el挂载点[vue框架][web前端]

el挂载点(Vue简单基础)

el是用来设置Vue实例挂载(或者说是管理)的元素的

Vue实例的作用范围是什么呐?

Vue会管理el选中的元素以及其内部的后代元素

• 如果我们在el命中的元素之外使用插值表达式尝试取出模型数据值的时候是取不出来数据的, 因为我们的Vue作用范围就是在其el命中当元素之中

• 我们的el其实就是在设置我们Vue的作用范围, 我们的le选中的元素也就是我们的Vue的作用范围, 其实此时我们就可以说是已经是将我们的Vue绑定到了我们的此时的元素上, 我们此时在这个元素的标签体内部就可以使用插值表达式取出这个Vue对象中的模型数据的值了

  • 当我们使用Vue核心对象的el属性挂载到了某个标签上的时候我们此时就是这个Vue对象和这个元素绑定成功了, 使用插值表达式其实也就是将我们的模型数据取出而已, 我们通过v-mode指令等等其实也就是将我们的数据模型和挂载到的表单元素的value属性值进行了一个进一步的绑定而已

  • 模型数据就是data属性中的值

  • 后面我们还会有对应的其他语法, 我们可以使用一些指令来让我们的数据模型和我们的Vue作用范围之内的标签的某个属性值等等绑定到一起, 那么我们通过操作这个Vue实例中的模型数据的值, 那么对应的标签的对应的属性值也就会跟着发生改变

我们前面演示的时候el后面都是使用的id选择器, 那么el后面设置挂载点的时候可不可以使用其他的选择器?

可以使用其他的选择器,但是建议使用id选择器

• 因为id选择器只会选中一个元素, 语义清晰,而其他的类选择器等都可能选中多个元素, 会导致语义不清晰

前面我们演示的时候el选中的都是div元素, 那么是否可以设置其他的dom元素?

• 可以使用设置的双标签, 但是不能使用html和body标签
  • 单标签没有标签体内容部分, 所以无法取出模型数据,