Vue----单文件组件

 

引入:@1官方脚手架 @2挂载vm对象 @3组件引入并渲染到vm中

单文件组件也有全局组件和局部组件只是把一个组件单独写在一个.vue文件中,供别的组件引入然后注册

引入文件时:一般使用相对路径 上一下用../ 同级使用./ 下级使用/ @ 代表src文件夹

举例：

APP.vue文件

<template>

  <div>

    <Box1>Box1>

    <Nav1>Nav1>

  div>

template>

<script>

import Box1 from "./Box1.vue"

import Box1 from "@/Box1.vue"

// @代表src目录的意思

// 注册名不能跟Vue原生Dom重名，

// 注册名字是驼峰，使用时要用连字符

import Nav1 from "./Nav1.vue"

// 注册的组件使用时可以用双标签也可以用单标签；如果有插槽时就必须用双标签

export default {

  components: {

    Box1:Box1,

    Nav1

  }

}

// 如果，Vue的script注释了，在打包的时候vue的打包环境 会帮我们把这个文件解析成为一个对象 然后添加一个

// template属性 值为解析的