上一篇的vue项目已经搭建运行了起来,我用惯了idea这里也用的idea打开的项目。貌似其他软件写前端更好。

打开项目的项目路径是这样的

写惯了后台,第一眼看的时候感觉这个项目路径很乱,后面才知道我们只需要关注src文件夹和主目录下的index.html,其他的可以忽略掉。当然是对我这种小白来说的。

src文件夹目录结构

这里需要理解的就是vue的组件和路由的转跳了

大致理解vue的目录结构

index.html内容

App.vue的内容

router路径下的index.js内容

components路径下的HelloWord.vue内容

突然接到项目,这边没时间慢慢写了,就传一下我之前写的笔记吧。

这是我大致入门一天理解的东西,存在这里记录一下。

接上一篇:vue零基础入门记录的更多相关文章

  1. Vue零基础入门记录

    在2020年这个开局不利的年份毕业,实习工作都很难得.最近来到一家单位,为了减小开支实习生过来了的话前端后端都要写.用Vue和ElementUI做界面.以前的前端vue了解还停留在new一个Vue实例 ...

  2. Springboot整合Redis入门完整篇,零基础入门教学教程

    记录一次简易集成Redis缓存 自定义Redisconfig配置 自定义序列化操作 加深印像 整合前提工具环境准备: 1.redis官网 https://redis.io/download 下载安装r ...

  3. Linux及Arm-Linux程序开发笔记(零基础入门篇)

    Linux及Arm-Linux程序开发笔记(零基础入门篇)  作者:一点一滴的Beer http://beer.cnblogs.com/ 本文地址:http://www.cnblogs.com/bee ...

  4. Linux从入门到放弃、零基础入门Linux(第四篇):在虚拟机vmware中安装centos7.7

    如果是新手,建议安装带图形化界面的centos,这里以安装centos7.7的64位为例 一.下载系统镜像 镜像文件下载链接https://wiki.centos.org/Download 阿里云官网 ...

  5. Linux从入门到放弃、零基础入门Linux(第三篇):在虚拟机vmware中安装linux(二)超详细手把手教你安装centos6分步图解

    一.继续在vmware中安装centos6.9 本次安装是进行最小化安装,即没有图形化界面的安装,如果是新手,建议安装带图形化界面的centos, 具体参考Linux从入门到放弃.零基础入门Linux ...

  6. 【Linux开发】Linux及Arm-Linux程序开发笔记(零基础入门篇)

    Linux及Arm-Linux程序开发笔记(零基础入门篇) 作者:一点一滴的Beer http://beer.cnblogs.com/ 本文地址:http://www.cnblogs.com/beer ...

  7. 091 01 Android 零基础入门 02 Java面向对象 02 Java封装 01 封装的实现 03 # 088 01 Android 零基础入门 02 Java面向对象 02 Java封装 02 static关键字 01 static关键字(上)

    091 01 Android 零基础入门 02 Java面向对象 02 Java封装 01 封装的实现 03 # 088 01 Android 零基础入门 02 Java面向对象 02 Java封装 ...

  8. 111 01 Android 零基础入门 02 Java面向对象 04 Java继承(上)02 继承的实现 01 继承的实现

    111 01 Android 零基础入门 02 Java面向对象 04 Java继承(上)02 继承的实现 01 继承的实现 本文知识点: 继承的实现 说明:因为时间紧张,本人写博客过程中只是对知识点 ...

  9. Cloudera Manager、CDH零基础入门、线路指导 http://www.aboutyun.com/thread-9219-1-1.html (出处: about云开发)

    Cloudera Manager.CDH零基础入门.线路指导http://www.aboutyun.com/thread-9219-1-1.html(出处: about云开发) 问题导读:1.什么是c ...

随机推荐

  1. [Inno Setup] Do not show application version in “Program and Features” control panel

    Set AppVersion empty. But, then you have to set the AppVerName. Depending on your needs either set i ...

  2. Android:RelativeLayout 内容居中

    Android RelativeLayout 内容居中解决办法: 使用Linearlayout本来利用父控件的gravity属性是很好解决的.但是对应RelativeLayout虽然有gravity属 ...

  3. Express 文档(常见问题)

    常见问题 我该如何构建我的应用程序? 这个问题没有明确的答案,答案取决于你的应用程序规模和所涉及的团队,为了尽可能灵活,Express在结构方面没有做出任何假设. 在你喜欢的任何目录结构中,路由和其他 ...

  4. 父级元素绑定定mouseout和mouseover,移过子元素是都会触发

    2019独角兽企业重金招聘Python工程师标准>>> mouseover与mouseenter 不论鼠标指针穿过被选元素或其子元素,都会触发 mouseover 事件. 只有在鼠标 ...

  5. CF思维联系–CodeForces -224C - Bracket Sequence

    ACM思维题训练集合 A bracket sequence is a string, containing only characters "(", ")", ...

  6. CF思维联系–CodeForces - 223 C Partial Sums(组合数学的先线性递推)

    ACM思维题训练集合 You've got an array a, consisting of n integers. The array elements are indexed from 1 to ...

  7. python(字符编码与转码)

    一.字符编码演变史 二进制(0 1) """ 算机中的所有数据,不论是文字.图片.视频.还是音频文件,本质上最终都是按照类似 01010101 的二进制存储的,再说简单点 ...

  8. muduo网络库源码学习————线程本地单例类封装

    muduo库中线程本地单例类封装代码是ThreadLocalSingleton.h 如下所示: //线程本地单例类封装 // Use of this source code is governed b ...

  9. 集成学习基础知识总结-Bagging-Boosting

    理论 在概率近似正确((probably approximately correct)学习框架下.一个概念是强可学习的充分必要条件是这个概念是弱可学习(仅比随机猜测稍好). 要求 个体学习器要好而不同 ...

  10. 布局问题杂(html和css)

    \(一.删除线可以用一对strike标签括起来\) <p><strike>删除线可以用一对strike标签括起来</strike></p> \(\col ...