1、assest:

图片等等......

2、components:

组件

3、App.vue:

根组件,三个部分:模板、行为(处理逻辑)、样式;

模板:

只能有一个根标签;

<HelloWorld/>

行为里面引入组建后,用这个标签来对它们之间产生关联;

行为:

import HelloWorld from './components/HelloWorld'

这是另外一个组件,用来关联组件,组件可以理解为一个功能的页面,项目都是由多组件来完成的;

export default{

  name:'app',

  components:{ HelloWorld,Home }

}

这里是注册组件;需要先引入组件,再注册,再写出来标签,才能真正产生关联;

4、main.js(重要):

跟index.html有直接的联系,当执行完index.html后紧接着执行的就是main.js;

import Vue from 'vue'

引入vue就可以在下面实例化出来

new Vue({

  el:'#app',  //el:element,'#app'就是index.html中的id=‘app’

  template:'<App/>',  //'<App/>'组件调用的标签

  components:{ App }  //调用App这个组件

})

Vue--的src文件的更多相关文章

  1. Vue 框架-11-介绍src文件流程及根组件app+HBuilder 配置

    Vue 框架-11-介绍src文件流程及根组件app+HBuilder 配置 这是上一篇对目录简单介绍: 关于编辑器,可以使用轻量级的 Sublime Text 3,我使用的是 HBuilder, 但 ...

  2. vue 构建项目 文件引入

    1.vue引用依赖文件.  举例:axios 先安装 axios.如果直接安装 vue-axios 会报错 npm install axios npm install --save axios vue ...

  3. 前端vue实现pdf文件的在线预览

    3.前端vue实现pdf文件的在线预览 我是通过 <iframe> 标签就可以满足我工作的 pdf预览需求 如果<iframe> 无法满足需求 , 可以使用pdf.js这个插件 ...

  4. vue打包dist文件时,图片找不到

    1.vue打包dist文件时,图片找不到,无法像在本地一样查看 问题描述: 本地代码:<div class="icon"><img :src="'../ ...

  5. vue中的文件上传和下载

    文件上传 vue中的文件上传主要分为两步:前台获取到文件和提交到后台 获取文件 前台获取文件,主要是采用input框来实现 <el-dialog :title="addName&quo ...

  6. VUE组件 单独文件封装

    https://www.cnblogs.com/SamWeb/p/6391373.html vuejs 单文件组件.vue 文件   vuejs 自定义了一种.vue文件,可以把html, css, ...

  7. Vue 多路由文件的合并

    Vue 多路由文件的合并 1.使用的是ES6 数组的合并方法 let routes = new Set([...routes1, ...homerouters]);2.两个路由文件,导出的实际上就是一 ...

  8. vue之element-ui文件上传

    vue之element-ui文件上传 文件上传需求 ​ 对于文件上传,实际项目中我们的需求一般分两种: 对于单个的文件上传,比如拖动上传个图片之类的,或者是文件. 和表单一起实现上传(这种情况一般都是 ...

  9. vue 设置头文件

    vue的头文件是在index.html文件中设置的,毕竟vue的入口 先说一下标签页的名字: 就是这个名字的设置,要想每个标签页的名字都不一样,需要做以下这三步:1. 首先,在index.html文件 ...

  10. vue 上传文件 和 下载文件

    Vue上传文件,不必使用什么element 的uplaod, 也不用什么npm上找的个人写的包,就用原生的Vue加axios就行了, 废话不多说,直接上代码:html: <input type= ...

随机推荐

  1. [GS]uuid-ossp

    uuid-ossp 原贴地址:http://postgres.cn/docs/9.6/uuid-ossp.html 关于 OSSP的含义 uuid-ossp模块提供函数使用几种标准算法之一产生通用唯一 ...

  2. spark-shell简单使用介绍(scala)

    >>提君博客原创  http://www.cnblogs.com/tijun/  << 提君博客原创 1.进入命令窗口 ./bin/spark-shell 附上帮助指令,查看一 ...

  3. checkbox操作判断 Jquery选择器

    function checkAll(d){ console.log(d); console.log(d.checked); //注意 这里是d不是$(d) 不是jQuery对象 if(d.checke ...

  4. RabbitMQ基本操作

    更加详细的 链接https://www.cnblogs.com/dwlsxj/p/RabbitMQ.html RabbitMQ基础知识 一.背景 RabbitMQ是一个由erlang开发的AMQP(A ...

  5. element-ui 源码解析 一

    Button组件 button.vue <template> <button class="el-button" @click="handleClick ...

  6. Golang的时间生成,格式化,以及获取函数执行时间的方法

    最近都在通过完成一些列功能强化自己对常用api的熟悉. 然而关于时间的api几乎是最常用的api类型,所以总结一些常用的. 以YY-mm-dd HH:MM:SS.9位 输出当前时间: func mai ...

  7. 如何通过stat获取目录或文件的权限的数字形式

    man stat 查看帮助. -c --format=FORMAT use the specified FORMAT instead of the default; output a new line ...

  8. Yii2控制台程序最佳实践

    模板工程标准的控制台程序要素: (1)完整明确文字提示用户(并且使用红,绿,黄三种颜色标识提示文字:红色为错误相关,绿色为成功相关,黄色为进行中提示) (2)告知用户运行进度(完成任务的一部分即显示进 ...

  9. Java HashMap的put操作(Java1.8)

    https://www.cnblogs.com/JzedyBlogs/p/10208295.html 写得非常好: 这个是Java1.8 ------------------------------- ...

  10. 怎样利用ADO中的adoquery进行缓存更新?????(100分)

    我用BDE时,用query与updatesql相结合进行缓存更新,但是在ADO中没有updatesql,只有用adoquery,在DBGRID中,用CANCELUPADTE,只能取消一条记录,烦恼不已 ...