当前位置: 首页 > news >正文

【Vue】el 和 data短小精湛的细节!

hello,我是小索奇,精心制作的Vue教程持续更新哈,花费了大量的时间和精力,总结拓展了很多疑难点,想要学习&巩固&避坑就一起学习叭~

el 与 data 的两种写法

el共有2种写法

el表达式主要用来在模板中展示数据,它可以输出简单的变量值,也可以调用方法。语法是${表达式}

  1. 创建Vue实例对象的时候配置el属性

  2. 先创建Vue实例,随后再通过VM.$mount('#root')指定el的值

根据需求设置,比如设置1000s后挂载

setTimeout(()=>{v.$mount('#root')},1000)

data的2种写法

  1. 对象式:data: { }

  2. 函数式:data() { return { } }

// 对象式
data:{name:'即兴小索奇'
}
// 函数式
data(){return {name:'即兴小索奇'}
}

函数式可以在每个实例中返回新的对象,防止对象被复用时数据互相污染

在这里哪种写法都可以,但到后期给伙伴们讲到组件时,data必须使用函数,否则会报错

注意

一定要牢记:由Vue管理的函数,一定不要写箭头函数,否则 this 就不再是Vue实例了,箭头函数没有this,那么向上"继承",找到全局window,这句话能带你走更长的路~

对您有用的话请点个免费的爱心叭~

下期讲解MVVM模型

http://www.lryc.cn/news/169722.html

相关文章:

  • 前端screenfull实现界面全屏展示功能
  • Dockerfile 制作常用命令总结
  • uniapp项目实践总结(十七)实现滚动触底加载
  • SAP入门到放弃系列之QM质量检验流程概述
  • Ansys Zemax | 光学系统设计中如何使用玻璃替换方法来优化玻璃
  • springboot基础--实现默认登录页面
  • TDesign WXS语法
  • Iterator设计模式
  • ROS 入门
  • 第四章 Linux网络编程
  • 无涯教程-JavaScript - OFFSET函数
  • rust切片
  • 2023/9/18 -- C++/QT
  • vue柱状图+折线图组合
  • js中如何实现一个简单的防抖函数?
  • mysq 主从同步错误之 Error_code 1032 handler error HA_ERR_KEY_NOT_FOUND
  • 蓝桥杯 题库 简单 每日十题 day4
  • l8-d21 域名解析与http服务器实现原理
  • 网络安全(黑客技术)自学规划
  • 阻止用邮件不停注册wordpress账户的方法
  • 低代码工具大比拼:哪个最适合你?
  • 用Python实现链式调用
  • 基于SSM的汽车租赁后台管理系统
  • Word 文档转换 PDF、图片
  • 解决Permission is not allowed后基于Ubuntu23.04安装配置docker与docker-compose
  • [ABC118D] Match Matching
  • 程序员必须掌握哪些算法?
  • Java高级之File类、节点流、缓冲流、转换流、标准I/O流、打印流、数据流
  • 解决WSL2占用内存过多问题(Docker on WSL2: VmmemWSL)
  • 华为云云耀云服务器L实例评测|了解配置和管理L型云服务器