vue页面有哪些组成-环球热点评

来源:php中文网 | 2022-12-20 14:01:47 |

本教程操作环境:windows7系统、vue3版,DELL G3电脑。

一个vue页面通常由三部分组成:模板(template)、js(script)、样式(style)


(相关资料图)

<template>界面展示代码(需要注意的是只能有一个大的div)</template>

<script>export default {业务实现代码}</script>

<style scoped >界面布局代码(scoped 解决了css全局污染)</style>

[template-模板]

(1) 模板只能包含一个父节点,也就是说顶层的div只能有一个(如上图,父节点为#app的div,其没有兄弟节点)

(2)<router-view/>是子路由视图插槽,后面的路由页面都显示在此处,相当于iframe

【script-JS代码】

vue通常用es6来写,用export default导出,其下面可以包含数据data,生命周期(mounted等),方法(methods)等。

【style-CSS样式】

样式通过style标签<style></style>包裹,默认是影响全局的,如需定义作用域只在该组件下起作用,需在标签上加scoped,<style scoped></style>

引入外部CSS示例:

<style>    import "./assets/css/public.css"</style>

以上就是vue页面有哪些组成的详细内容,更多请关注php中文网其它相关文章!

关键词: vue3 vue.js