- 博客(8)
- 收藏
- 关注
RSS订阅原创 Vue中的scoped实现原理及穿透方法
之前对scoped不太理解，今天终于get到他的点了！什么是scoped？在vue文件中的style标签上，有一个特殊的属性：scoped。当一个style标签拥有scoped属性时，它的CSS样式就只能作用于当前的组件，也就是说，该样式只能适用于当前组件元素。通过该属性，可以使得组件之间的样式不互相污染。如果一个项目中的所有style标签全部加上了scoped，相当于实现了样式的模块化。scoped实现原理vue中的scoped属性的效果主要通过PostCSS转译实现，如下是转译前的vue代码：
2020-09-23 20:09:34
1143
原创 在vue项目中遇到git remote:HTTP Basic:Access denied错误
1.git remote:HTTP Basic:Access denied 错误解决方法：先确定账号名和密码是否修改了，如果没有，可能就是你的账号或密码输入错误如果账号和密码修改了，就git config --global http.emptyAuth true（用楼主的这个方式：https://www.cnblogs.com/heyongboke/p/9999824.html）2.vue报错/style-loader:Adds some css to the DOM by adding a
2020-09-21 18:43:27
523
原创 在vue项目中遇到npm ERR! missing script:build报错
1.遇到报错内容：Uncaught Error:[vue-router]route config "component"for path:cannot be a string id. Use an actual component instead.解决方法：一定一定要检查router路由，这里面你一定有写重复了的或者写错的。2.遇到npm run build报错内容：npm ERR! missing script:build解决办法：请看package.json里面的script里面的build是否配
2020-09-16 22:18:03
7714
原创 在Vue怎么使用Echarts创建图表
在后台管理系统中，我们经常会遇到图表，比如说：柱形图，饼状图，折线图，雷达图等等，而用来写图表插件有很多，我这里主要介绍Echarts在项目里怎么使用。官网地址如下：Echarts图表官网详细信息请阅览他们的官网文档和实例，各种图表都比较完善。一.安装插件方法一：npm安装Echartsnpm install echarts -S方法二：cnpm安装Echarts1.首先我们需要安装cnpmnpm install -g cnpm --registry=https://registry.n
2020-09-16 09:01:16
390
原创 screenfull.js实现全屏放大缩放功能（vue项目中运用）
在我们做的项目中可能会有全屏功能的需求，其实这个也比较简单实现，下面我们介绍以screenfull.js实现全屏功能，废话不多说，直接上代码。第一步：安装：在命令行中执行：npm install --save screenfull （注：因为这是生产依赖，所以执行–save）第二步：直接上代码：<template> <el-button type="primary" class="button" @click="buttoncli">摁我全屏</el-bu..
2020-09-15 16:17:48
685
原创 使用vue修改vant自带的样式
**1.今天用vue写页面时，发现使用vant的有些U## 标题I组件，修改CSS样式无效。**css一般都会使用sass或者less，加了scoped后修改的样式不起作用，即使加了important也没用。在vue项目中，当style 标签有scoped属性时，它的 CSS 样式只作用于当前组件中的元素，父组件的样式将不会渗透到子组件中。解决办法：1.对于css语法起作用使用深度选择器，使用 >>> 操作符，将scoped样式中的选择器“深入”，即影响子组件上述代码将会
2020-09-10 12:01:17
2825
1
原创 vue中的this指向问题
实际项目过程中。在data里面定义好了 phone的值。在发送ajax请求后,this.phone的值便拿不到了。这里我axios去请求。then的回调是用es5的写法写的。发送请求前，this.phone还有值，发送请求后this.phone的值就有问题了。纠其原因是es5 的写法，this的值发生了变化。指向undefined。而这里我们的this 需要指向vue实例这里需要再继续补充箭头函数的知识。箭头函数的this指向的是外层代码块中的this。所以this 当然指向的是vue实例，再用th
2020-09-09 21:26:44
301
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人