1.注册全局组件(是一个单vue页面组成的一个组件,而不是现拼的template结构)

结构:

代码:main.js

import UserList from './components/UserList'
Vue.component('user-list', UserList)

2. 让头像不压缩的填充展示

img{

  display: block;

}

3. 背景图引入路径错误问题:

如图,结构如下,怎么核对检查,路径和文件名都是没错的,

但是不清楚为什么就是找不到图片还报错

后来才想到,我的sass文件是引入在app.vue中的,所以路径不对

改完后果然ok了:

4.sass公用样式

第一种:

.公用样式{...}

.div{

  @extend .公用样式;

}

第二种:

@mixin .公用样式(参数){

  ...

  @content;

};

.div{

  @include .公用样式(参数){

    自己的单独样式

  }

};

vue经验 - 实战疑点总结的更多相关文章

  1. webpack+vue项目实战(四,前端与后端的数据交互和前端展示数据)

    地址:https://segmentfault.com/a/1190000010063757 1.前言 今天要做的,就是在上一篇文章的基础上,进行功能页面的开发.简单点说呢,就是与后端的数据交互和怎么 ...

  2. vue.js实战——购物车练习(包含全选功能)

    vue.js实战第5章 54页的练习1 直接放代码好了,全选的部分搞了好久,代码好像有点啰嗦,好在实现功能了(*^▽^*) HTML: <!DOCTYPE html> <html l ...

  3. 【Vue.js实战案例】- Vue.js递归组件实现组织架构树和选人功能

    大家好!先上图看看本次案例的整体效果. 浪奔,浪流,万里涛涛江水永不休.如果在jq时代来实这个功能简直有些噩梦了,但是自从前端思想发展到现在的以MVVM为主流的大背景下,来实现一个这样繁杂的功能简直不 ...

  4. vue项目实战, webpack 配置流程记录

    vue项目实战记录,地址在这 购物车单界面 npm install npm run dev 跑起来可以看到界面效果 这里简单记录一下webpack的编译流程 入口 package.json " ...

  5. 分享Node.js + Koa2 + MySQL + Vue.js 实战开发一套完整个人博客项目网站

    这是个什么的项目? 使用 Node.js + Koa2 + MySQL + Vue.js 实战开发一套完整个人博客项目网站. 博客线上地址:www.boblog.com Github地址:https: ...

  6. vue.js 实战 todo list

    vue.js 起源 vue.js 的作者是尤雨溪,是一名中国人,之前在谷歌工作,现在在全职维护 vue 项目. vue.js 是 2014 年推出来的.现在已经更新到 2.x 版本,3.0 版本会在 ...

  7. vue前端实战注意事项

    1. vue前端实战注意事项 1.1. 预备 1.1.1. Eslint 这是个语法检查工具,我用webstorm作为开发的ide,这个语法检查还是太严格了,一个空格啥的都会报错,对新手来讲还是建议关 ...

  8. vue项目实战

    本篇文章主要介绍了vue的环境配置,vue项目的目录结构以及在开发vue项目中问题的一些解决方案. 环境配置及目录结构 1.安装node.js(http://www.runoob.com/nodejs ...

  9. Vue.js 实战教程(附demo)

    在实战之前,你需要对vuejs的基础语法有一定的了解,可以通过以下几个途径进行学习: vue.js官方文档:https://cn.vuejs.org/v2/guide/index.html vue.j ...

随机推荐

  1. ubuntu16.04 桌面图标左侧,右侧,底部进行切换

    转载:https://jingyan.baidu.com/article/e52e36154e6af340c60c518c.html 传统的 Unity 桌面环境,其应用程序启动器的容器——Launc ...

  2. How to use base class's assignment operator in C++

    看了android下的代码,好长时间没看了,有个关于C++的知识点不是很清楚,查了下: 如何使用基类中的赋值运算符? 引述自http://stackoverflow.com/questions/122 ...

  3. Global.asax的Application_BeginRequest实现url重写无后缀的代码

    本文为大家详细介绍下利用Global.asax的Application_BeginRequest 实现url重写其无后缀,具体核心代码如下,有需求的朋友可以参考下,希望对大家有所帮助 利用Global ...

  4. sql server 2005 怎么看是不是企业版

    已经安装了SQL server 2005 怎么确定它是企业版 还是标准版??? 执行sql:SELECT @@VERSION在结果里看,比如我这里是(里面有Enterprise Edition,表示企 ...

  5. 运行jsp常犯的错误

    error 未启动tomcat服务 tomcat端口是否已改动 404: 未部署web应用 运行时URL输入错误 检查文件的存放位置(存放文件的目录无法对外引用,如WEB-INF , META-INF ...

  6. mysql5.7 启动报发生系统错误2

    1. http://dev.mysql.com/downloads/mysql/        下载mysql5.7   zip包 2. 下载好后解压文件,解压的内容如图,您可以把内容解压到想要的位置 ...

  7. Gulp--Less

    摘要: 前面分享了一些less的是用方法,包括在grunt中,今天在分享下使用gulp来编译less文件.首先需要安装gulp,如何安装请看文章. 安装插件: gulp编译less使用了gulp-le ...

  8. redis sentinels哨兵集群环境配置

    # Redis configuration file example. # # Note that in order to read the configuration file, Redis mus ...

  9. GCD (Grand Central Dispatch) 笔记

    GCD (Grand Central Dispatch) 是Apple公司开发的一种技术,它旨在优化多核环境中的并发操作并取代传统多线程的编程模式. 在Mac OS X 10.6和IOS 4.0之后开 ...

  10. Uva--11324--The Largest Clique【有向图强连通分量】

    链接:http://uva.onlinejudge.org/index.php?option=com_onlinejudge&Itemid=8&page=show_problem&am ...