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

Vue实用操作篇-1-第一个 Vue 程序

安装 Vue 非常的简便,只需下载好 Vue 对应的 .js 文件,在 html 中引入 vue.js 即可使用 Vue

下载好了 vue.js 我们便可以编写我们的第一个 vue 程序了

<!doctype html>
<html lang="zh-CN"><head><meta charset="utf-8" /><title>first-vue</title><!-- 加载vue --><script src = "js/vue.js"></script></head><body><!-- 指定挂载位置 --><div id = "app"></div><!-- Vue 程序 --><script>// 创建 Vue 的实例对象const myVue = new Vue(//可变参数,opting -> 选项,其中可以编写大量的配置项{// 配置项1:模版语句template : '<h1>hello vue!</h1>'})// 将 myVue 这个实例挂在在 app 上myVue.$mount('#app')</script></body>
</html>

在浏览器运行这个 html 文件

对于第一个程序,我们需要知道以下几点基础知识

1.我们通过 new vue() 这个对象来调用 vue 组件中的内容

2.对于 vue 对象的创建,我们需要对其指定可选项 options

即 :

let options = {template : '<h1>hello vue!</h1>'
}

对于options , 里面是许多的可选项 option ,以键值对的形式存在,当我们需要使用某些特定功能时添加 option,在 new vue() 时指定 options 时,参数名可省略

const myVue = new Vue({template : '<h1>hello vue!</h1>'key1 : value1key2 : value2
})

3.template 配置项:用于指定模版语句

模版语句可以是 html 代码,也可以是 Vue 指定的一些特殊规则

4.Vue 对象的实例都有一个 $mount() 方法

$mount() 的作用是将实例挂载到指定位置,将其挂载后方便对其进行管理

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

相关文章:

  • Qwen2-VL的微调及量化
  • [数据集][目标检测]车窗状态检测车窗开关检测数据集VOC+YOLO格式299张3类别
  • 自动泊车系统中的YOLOv8 pose关键点车位线检测
  • Java html生成pdf和图片
  • JavaWeb笔记整理——Redis
  • 数据库(mysql)常用命令
  • 源网荷储一体化新型电力系统解决方案
  • 树莓派安装 OpenCV 教程
  • 01,大数据总结,zookeeper
  • 伪工厂模式制造敌人
  • 【linux】pwd命令
  • Python 如何封装工具类方法,以及使用md5加密
  • 网络编程的应用
  • 佰朔资本:国内海风加速招标 船舶行业景气上行
  • 理解AAC和Opus的编码与解码流程
  • 设计图纸加密方法知多少?小编给你讲清楚
  • pycv实时目标检测快速实现
  • 记录下如何让字体在div内 自动换行 上下居中
  • Shell篇之编写MySQL启动脚本
  • supermap Iclient3d for cesium加载地形并夸大地形
  • 一文解读OLAP的工具和应用软件
  • xml重点笔记(尚学堂 3h)
  • 爬虫代理API的全面解析:让数据抓取更高效
  • PCL 点云中的植被信息提取(C++详细过程版)
  • requests-html的具体使用方法有哪些?
  • YOLOv9改进策略【卷积层】| AKConv: 具有任意采样形状和任意参数数量的卷积核
  • 图神经网络池化方法
  • 小琳AI课堂:确保大语言模型安全的八大策略--从数据隐私到用户教育
  • Python 数学建模——高斯核密度估计
  • Flink+Spark相关记录