Vue: main.js template: '<App/>' 的意义Vue: main.js template: '<App/>' 的意义Vue: main.js template: '<App/>' 的意义Vue: main.js template: '<App/>' 的意义
  • 首页
  • 博客
  • 文件
  • 书签
  • 分析
  • 登录
Search
Generic filters

Vue: main.js template: '<App/>' 的意义

Published by admin at 2022年11月8日
Categories
  • Vue
Tags
new Vue({
  el: '#app',
  router,
  components: { App },
  template: '<App/>'
})

components 是声明有哪些组件
template 是使用哪个组件 官方文档
el: '#app' 是index.html 的<div id="app"></div>
App.vue <div id="app">xxxxxxxx</div> 会替换index.html中的<div id="app"></div>,因为外层元素都是<div id="app"></div> 所以都是感觉只是替换了里面的

如果把index.html中改为:

<div id="app" class="aaa"></div>

App.vue中改为:

<div id="app" class="bbb">
  ...
</div>

查看浏览器检查就会发现<div id="app" class="aaa"></div>被<div id="app" class="bbb">...</div>替换掉了:

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width,initial-scale=1.0">
    <title>hello</title>
  </head>
  <body>
    <div id="app" class="aaa"></div>
    <!-- built files will be auto injected -->
  <script type="text/javascript" src="/app.js"></script></body>
</html>

发表回复 取消回复

您的电子邮箱地址不会被公开。 必填项已用*标注

Categories

  • 猫
  • Python
  • MySQL
  • Django
  • Html/CSS
  • JavaScript
  • Vue
  • RegExp
  • php
  • Practice
  • Virtualization
  • Linux
  • Windows
  • Android
  • NAS
  • Software
  • Hardware
  • Network
  • Router
  • Office
  • WordPress
  • SEO
  • English
  • Games
  • Recipes
  • living
  • Memorandum
  • Essays
  • 未分类

归档

©2015-2022 Alaica Blog support@alaica.com