Vue 入门：el: '#app' 是什么意思 & component 组件 & 实现 ToDoList

最新推荐文章于 2022-09-18 16:55:13 发布

莫亓

最新推荐文章于 2022-09-18 16:55:13 发布

阅读量1w

点赞数 11

分类专栏：初次见面请多关照

本文链接：https://blog.csdn.net/Bule_daze/article/details/105951157

版权

🧙‍♀️ 用原生 js 实现基本页面

<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <title>Hello World</title>
  <script src="./vue.js"></script>
</head>

<body>
  <div id="app"></div>
  <script>
    var dom = document.getElementById('app');
    dom.innerHTML = 'hello world';
  </script>
</body>

</html>

🧙‍♀️ 用 vue 实现

在官方文档中下载 vue 库。
在这里插入图片描述

<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <title>Hello World</title>
  <script src="./vue.js"></script>    <!-- 引入 vue 库 -->
</head>

<body>
  <div id="app">{
  { content }}</div>  <!-- 通过 {
   {}} 调取下面 data 中的内容 -->
  <script>
    var app = new Vue({
       // 首先创建一个Vue的实例，这个实例接收一些配置项
      el: '#app',         // el 配置项指实例负责管理的区域； #app 指 id="app" 的dom标签里的所有内容（只对其有效）

最低0.47元/天解锁文章

莫亓

关注

11
点赞
踩
40

收藏

觉得还不错? 一键收藏
2
评论
Vue 入门：el: '#app' 是什么意思 & component 组件 & 实现 ToDoList

????‍♀️ 用原生 js 实现基本页面<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta h...
复制链接

扫一扫