vue的挂载

//index.html
  <body>
    <div id="app"></div>
    <script type="module" src="/src/main.js"></script>
  </body>

div的id为app,在script的引入文件中,将vue实例将被挂载到这个id为app的div元素上。

//main.js
const app = createApp(App)
app.use(createPinia())
app.use(router)
app.mount('#app')

const app = createApp(App): 使用createApp函数创建了一个Vue应用实例。App是作为根组件的组件对象,这里表示整个应用的根组件。

app.use(createPinia()): 使用createPinia函数创建了Pinia的实例,并通过app.use方法将Pinia插件注册到Vue应用中。Pinia是一个Vue状态管理库,用于管理全局状态。

app.use(router): 使用app.use方法注册Vue Router插件到Vue应用中。router是一个Vue Router的实例,包含了应用的路由配置。

app.mount('#app'): 最后,使用app.mount方法将Vue应用挂载到DOM元素上。'#app'是挂载点的选择器,表示Vue应用将被挂载到具有id="app"的DOM元素上。这个步骤启动了Vue应用,使其开始监听和响应用户交互,并在挂载点上渲染应用的内容。

相关推荐
liuweidong08021 小时前
【Pandas】pandas Series rtruediv
前端·javascript·pandas
桂月二二1 小时前
深入探讨 Vue.js 的动态组件渲染与性能优化
vue.js
我想学LINUX3 小时前
【2024年华为OD机试】(C卷,100分)- 攀登者1 (Java & JS & Python&C/C++)
java·c语言·javascript·c++·python·游戏·华为od
然后就去远行吧4 小时前
小程序组件 —— 31 事件系统 - 事件绑定和事件对象
前端·javascript·小程序
夕阳_醉了4 小时前
如何在JS里进行深拷贝
开发语言·javascript·ecmascript
疯狂的沙粒6 小时前
对React的高阶组件的理解?应用场景?
前端·javascript·react.js·前端框架
星云code6 小时前
【HM-React】08. Layout模块
javascript·react.js·ecmascript
互联网-小阿宇7 小时前
【HTML+CSS+JS+VUE】web前端教程-31-css3新特性
前端·javascript·css
NoneCoder8 小时前
JavaScript系列(24)--内存管理机制详解
开发语言·javascript·ecmascript
oil欧哟8 小时前
uniapp 小程序 textarea 层级穿透,聚焦光标位置错误怎么办?
vue.js·小程序·uni-app·uniapp