![](https://img-blog.csdnimg.cn/20201014180756927.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
vue
Jackson_3791
小小程序员
展开
-
vue 禁止单独页面返回
用原生的方法过于复杂, 且无法满足同一页面需要特定前进后头的场景//改写replace 和 push 方法 ,去除警告const originalPush = VueRouter.prototype.pushVueRouter.prototype.push = function push(location) { return originalPush.call(this, location).catch((err) => err)}const originalReplace = VueR原创 2022-04-12 11:07:43 · 1393 阅读 · 0 评论 -
具名插槽 slot使用
1.普通的子组件插槽//Children.vue<div> <slot></slot></div>使用<Children> <span>123</span></Children>2.具名插槽//Children.vue<div> <span>123</span> <slot name="content"></slot>&l原创 2022-01-12 11:52:29 · 807 阅读 · 0 评论 -
js对象取值的时候 . 与 [ ] 的区别
一般对象的取值有两种方式,但是有什么区别呢?接下来举个例子var obj = {a:1,b:2,c:3}for(var key in obj){ console.log(obj.key)//会打印输出3个undefined,取不出值 console.log(obj[key])//会打印出1,2,3}它们两种取值方式,一般情况下都是可以的,但是通过上述例子可知,当是一个变量的时候,只能采用【】的形式才能将值取出。obj[key]就相当于obj[“a”],而obj.key是从obj中取出属转载 2022-01-12 09:57:35 · 679 阅读 · 0 评论 -
新建Vue实例 , 使用总线传递消息避免干涉
//枚举对应消息映射wsType.jsexport default { LOGIN_TIMEOUT: 'LG_0001', //登录超时消息 LOGIN_OTHERPLACE: 'LG_0002', //异地登录消息 IS_OCCUPIED: 'IS_OCCUPIED', //现场测评是否被占用 OCCUPIED: 'occupied', //占用 NOT_OCCUPIED: 'NotOccupied', //没占用 IND_RELOAD: 'IND_RELOAD' //首页刷新}/原创 2021-12-10 16:01:41 · 257 阅读 · 0 评论 -
export default 与ES6构造函数(类)的结合 --websocket函数封装
class Socket { constructor() { //constructor--声明类独有 this.ws = null this.url = null ... } getHostName(){ switch(){ ... } } export { Socket as default } --//修改默认导出的值---保证实例互不影响封装参考–链接主文件扩展文件可以结合以上两个文件根据业务需求封装自己的Socket实例方法使用import原创 2021-12-10 15:29:59 · 730 阅读 · 0 评论 -
cherrio 使用 ,爬虫
const getDataFun=()=>{ const param=data.string getData(param) .then((res) => { const reult=res?.data const $ = cheerio.load(reult) const aBox = $('.art原创 2021-11-29 20:33:29 · 294 阅读 · 0 评论 -
js every 在链式调用时,拿不到正确值
无返回值链式 , 结果不正确const flag = tempArray .slice(2, 1) .every((item) => item.value === 1)有返回值的链式 , 结果不正确 , 原因 , every时, 取的tempArray是原来的tempArray, 没有等待返回值后才进行遍历const flag = tempArray .splice(2, 1) .every((item) => item.value === 1)原创 2021-11-26 10:30:24 · 286 阅读 · 0 评论 -
svg 图标无法铺满的问题
//在svg 源文件的svg 头文件 加入 preserveAspectRatio="none meet" <?xml version="1.0" encoding="UTF-8"?><svg width="319px" height="76px" viewBox="0 0 319 76" version="1.1" xmlns="http://www.***/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" preserveAs原创 2021-11-08 15:50:33 · 671 阅读 · 0 评论 -
vscode 快速选词
ctrl + 左/右 光标快速到单词尾shift + 左/右 每次移动一个 , 选中ctrl+shift + 左/右 快速选完一个词chrl+shift + end 快速选完一句话到句尾----vscode配置原创 2021-10-15 12:05:24 · 4255 阅读 · 0 评论 -
vscode 新版本 配置bash终端
vscode 新版本 配置bash终端"terminal.integrated.profiles.windows": { "Git-Bash": { "path": "G:\\Git\\bin\\bash.exe", "args": [] } }, "terminal.integrated.defaultProfile.windows": "Git-Bash",原创 2021-10-10 21:09:01 · 511 阅读 · 0 评论 -
el-button 去除边框,hover保留
el-button要想按钮普通情况没有边框 , hover及其它效果有边框 , 可以加type=“text” 属性原创 2021-09-28 16:28:35 · 7701 阅读 · 0 评论 -
查看vue cli 版本号
终端输入 vue -VD:\Users\User\Desktop\临时\test2\libpro> vue -V@vue/cli 4.5.12原创 2021-08-28 14:21:53 · 923 阅读 · 0 评论 -
v-if v-else可以直接用数字0 1 来连用
<div v-if="showProgress0"> //隐藏123</div><div v-if="showProgress1"> //显示456</div>showProgress0:0,showProgress1:1原创 2021-08-26 15:48:45 · 306 阅读 · 0 评论 -
el-select allow-create不生效问题
filterable allow-create //与filterable 连用才会生效原创 2021-08-26 10:15:18 · 1651 阅读 · 0 评论 -
scss css选择器妙招
//&:not(:last-child).status_two { .btn { cursor: pointer; font-family: PingFangSC-Regular; font-size: 0.75rem; color: #3366ff; line-height: 0.75rem; &:not(:last-child) { margin-right: 0.75rem; &::after {原创 2021-08-20 17:25:00 · 594 阅读 · 0 评论 -
vue eventBus创建的两种方式
一 . 第一种: main.js创建1. //main.jsVue.prototype.$bus = new Vue();2.子组件(需要发出消息的组件)this.$bus.$emit("aaa")3.父组件(需要接收消息的组件)this.$bus.$on("aaa",()=>{ this.$refs.scroll.scroll.refresh()})...beforeDestroy() { this.$eventBus.$off('newProject') t原创 2021-08-13 11:09:30 · 370 阅读 · 0 评论 -
res.data对象遍历赋值
遍历对象 , 给本地addForm里面的值赋值 , this.$nextTick作用是让视图更新 this.$nextTick(() => { Object.keys(this.addForm).map((item) => { if (row[item]) this.addForm[item] = row[item] }) this.addForm.id = row.id })...原创 2021-08-09 20:25:42 · 1163 阅读 · 0 评论 -
vue 全局混入----状态判断是否执行点击
1.项目下创建 mps-ui\src\plugins\listenerClick.js2.文件内写法//listenerClick.jsimport { mapGetters } from 'vuex'export default { computed: { ...mapGetters(['leftNavStatus']) }, data() { return {} }, mounted() { if (document.getElementById('c原创 2021-08-07 13:00:49 · 503 阅读 · 0 评论 -
子组件使用父组件传入的样式
一般使用行内形式体现例子<template> <div class="emptyStyle"> <div class="emptyBox" :style="{ marginTop: top }"> <div class="pic"></div> <div class="wordUp font-tip" :style="{ lineHeight: lineHightUp }"> {{原创 2021-08-06 17:47:18 · 569 阅读 · 0 评论 -
svg-icon 更改颜色, 精品教程
1.在svg源文件中, 找到你需要修改的path内原来固定的填充颜色值将fill="#ddd"修改为fill=“currentColor”2.在html中使用时 , 给svg文件dom元素加一个自定义类名<svg-icon slot="prefix" icon-class="authorize_title" class="authorize_title" /> //自定义类名为authorize_title3.在样式中需要这样写.authoriz原创 2021-08-05 09:47:44 · 1925 阅读 · 0 评论 -
放大倍数, 样式适配
思路:const value = Window.devicePixelRatio1.通过Window.devicePixelRatio 获取放大比例//媒体查询 改变@media screen and (max-width: 1369px)base.css?v=1627548852:1.detail_box { transform: scale(1,0.9) translate(0,-6%);}2.通过 transform: scale(1,0.9) translate(0,-6原创 2021-08-04 10:28:49 · 71 阅读 · 0 评论 -
vue2.0 + scss + sass-resources-loader + element 实现换肤
1.vue项目根目录的vue.config.js----引入scss文件module.exports = { // 其他配置npm css: { loaderOptions: { sass: { prependData: ` './src/assets/styles/global.scss' './src/assets/styles/variable.scss' './src/asset原创 2021-08-03 15:13:43 · 432 阅读 · 0 评论 -
Syntax Error: SassError: Invalid CSS after ““: expected 1 selector or at-rule
标签有前后不一致的情况 , 导致渲染错误 , 本人使用的是scss语法原创 2021-08-03 14:36:30 · 2678 阅读 · 0 评论 -
vscode配置
{ // elsint配置TODO: "workbench.editor.enablePreview": false, // vscode默认启用了根据文件类型自动设置tabsize的选项 "editor.detectIndentation": false, // 重新设定tabsize "editor.tabSize": 4, // #值设置为true时,每次保存的时候自动格式化;值设置为false时,代码格式化请按shift+alt+F "editor.formatOnS原创 2021-07-03 14:16:44 · 137 阅读 · 0 评论 -
vue创建+rem 视口自适应
vue+vant 实现rem的转换=>视频地址原文文档地址1. 搭建环境1.1.输入 vue ui1.2. create project 创建项目1.3. 选择手动安装1.4. 选择配置文件1.5. 选择版本和postcss配置1.6. 选择预设—我们这边不选择预设1.7. 等待创建[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-mGTzhOBC-1608575680491)(./img/image-20201222012111107.p转载 2021-04-09 00:02:05 · 194 阅读 · 0 评论 -
Vue项目安装(前端)+Vuex指南
typora-copy-images-to: uploadvue create myvueVue项目安装1.主要功能选择2.版本3.路由模式:history("/")写no hash("#")是yes 4.预处理器–选择less语法(css)5.语法检测eslint–默认6.保存时进行语法检测7.In dedicated config files您喜欢将Babe 1、ESLint等的配置放在哪里?—放在专用配置文件中/放在pack.json文件中8.是否作为以后的模板.原创 2021-04-08 23:48:17 · 315 阅读 · 2 评论