
VUE
BiuBiu__A
这个作者很懒,什么都没留下…
展开
-
vue项目问题记录 pdf.js解决跨域问题 版本v2.16.105
是固定的,至于后边的fildata.pdfPath替换成你需要展示的pdf文件链接即可。来到刚放在public文件夹下的pdfjs插件文件夹。如果网站访问不到,这里放一个我正在使用的版本。官网下载pdfjs文件 并保存到vue。将改判断语句隐藏掉,即可解决跨域问题!打开web下的viewer.js。在viewer.js中搜索。其中的src路径地址。原创 2022-09-20 14:06:19 · 2132 阅读 · 5 评论 -
vue中使用gojs实例、包括调色板、线条流动、缩略预览、节点中实现分组、全屏,更换主题等实例
vue中使用gojs实例、包括调色板、线条流动、缩略预览、节点中实现分组、全屏,更换主题等实例原创 2022-06-16 17:05:32 · 1839 阅读 · 0 评论 -
处理npm install 因版本问题导致的报错 unable to resolve dependency tree(npm i --legacy-peer-deps)
报错信息:unable to resolve dependency tree意思是无法解析依赖树最简单的解决方法:npm i --legacy-peer-deps该命令是解决因npm版本不兼容产生的一系列问题 执行后项目即可运行第二种解决方法:npm -g install npm@6.x降低npm版本 实现兼容完美运行...原创 2022-04-18 16:05:37 · 670 阅读 · 1 评论 -
vue项目中gojs最新V2.2.5版本去除水印
在node_modules/gojs/release/go-module.js中搜索String.fromCharCode(a.charCodeAt此时可以看到String.fromCharCode(a.charCodeAt(g) ^ b[(b[c] + b[d]) % 256]);这一串代码往后看 他有一个判断条件 替换为如下代码即可;if(f.indexOf('GoJS 2.2 evaluation') > -1||f.indexOf('(c) 1998-2022 Northwoods So原创 2022-03-22 17:05:57 · 1797 阅读 · 3 评论 -
实现 javascript VUE对传输的文件 | 数据进行加密
如果只是用一下,实现一下加密效果,直接复制粘贴再调用就可以了!原创 2022-03-10 17:51:23 · 841 阅读 · 0 评论 -
web富文本编辑器wangEditor,基于vue|react的使用帮助文档地址,官方的,很详细
https://www.wangeditor.com/v5/guide/API.html#off原创 2022-03-02 10:14:01 · 693 阅读 · 0 评论 -
基于vue的protobuf如何在web端简单使用?解析加实例
Vue项目搭建好以后安装protobufjsnpmnpm install protobufjsyarnnpm install protobufjs安装成功后在项目src目录下新建proto目录,把后端给的proto文件放进去我的文件是test.proto 测试用的 内容如下syntax = "proto3";message Address{ string province = 1; string city = 2; string county = 3;}原创 2022-02-24 09:53:23 · 1660 阅读 · 1 评论 -
vue 本地上传XML文件转JSON,完整实例
1、NPM安装x2jsnpm i x2js2、在main.js引入import x2js from ‘x2js’Vue.prototype.$x2js = new x2js()3、定义一个组件,把一下代码复制进去,引入组件即可<template> <div class="file-button-box"> <a-button class="add" @click="add"> 新建 </a-button> <a-butto原创 2021-12-29 12:30:15 · 1330 阅读 · 0 评论 -
初始化项目时,遇到Antd is not defined
原因是按网上的教程配置在线主题时,安装了babel-plugin-import,并且修改了babel.config.js的内容,所以会有错误;解决方案1.在main.js引入ant-design-vue时改为如下引入:import Antd from 'ant-design-vue'2.移除babel.config.js文件中的如下代码 plugins: [ [ 'import', { libraryName: 'ant-design-vue'原创 2021-12-17 14:09:38 · 649 阅读 · 0 评论 -
vue项目实现页面自适应 通过lib-flexible插件+postcss-px2rem-exclude
lib-flexiblepostcss-px2rem-exclude淘宝也是采用这用自适应lib-flexible:会自动在html的head中添加一个meta name="viewport"的标签,同时会自动设置html的font-size为屏幕宽度除以10,也就是1rem等于html根节点的font-size。假如设计稿的宽度是750px,此时1rem应该等于75px。假如量的某个元素的宽度是150px,那么在css里面定义这个元素的宽度就是 width: 2rem,那么这就有点麻烦了,我他么还原创 2021-12-15 16:43:02 · 1410 阅读 · 0 评论 -
公司前端开发规范
前端开发规范1.0 命名规范1.1 目录命名所有目录使用 kebab-case 命名正例: head-search / page-loading / authorized / notice-icon反例: HeadSearch / PageLoading1.2 JS、CSS、SCSS、HTML、PNG 等文件命名全部采用小写方式, 以中划线分隔正例:render-dom.js / signup.css / index.html / company-logo.png反例: rend原创 2021-12-15 10:14:06 · 180 阅读 · 0 评论 -
vue开发技巧——批量注册全局组件
步骤:1、首先在components 中新建一个 global.js(自定义命名) 文件global.js//引入vueimport Vue from 'vue'//引入同目录下的全部组件const requireCom = require.context('.',false,/\.vue$/);//依次进行注册requireCom.keys().forEach(key => { // 字符串首字母大写处理 function strUp(str){ return str.char原创 2021-10-09 10:23:58 · 174 阅读 · 0 评论 -
VUE引入组件时地址报错?
引入组件时报错,只需要把地址后面的vue去掉就可以了Already included file name 'e:/Work_tmp/__HHManage/Admin/HongHao/src/admin/view/sysmanage/components/addDevice.vue' differs from file name 'e:/Work_tmp/__HHManage/Admin/HongHao/src/admin/view/sysmanage/components/adddevice.vue' o原创 2021-09-23 09:36:41 · 710 阅读 · 1 评论 -
GOJS学习笔记 GOJS结合vue使用
gojs是什么?GoJS是一个 JavaScript库,可让您在现代 Web 浏览器中轻松创建交互式图表。GoJS支持图形模板和图形对象属性到模型数据的数据绑定。您只需要保存和恢复模型,该模型由简单的 JavaScript 对象组成,其中包含您的应用程序需要的任何属性。许多预定义的工具和命令实现了大多数图表所需的标准行为。外观和行为的自定义主要是设置属性的问题。gojs使用的实例效果图:<template> <div id="myDiagramDiv" .原创 2021-09-17 13:34:51 · 958 阅读 · 0 评论 -
小程序swiper配置参数使用
原创 2021-09-02 10:03:05 · 266 阅读 · 0 评论 -
vue keep-alive以及activated,deactivated生命周期的区别及用法
vue官网的描述:<keep-alive> 包裹动态组件时,会缓存不活动的组件实例,而不是销毁它们。和 <transition> 相似,<keep-alive> 是一个抽象组件:它自身不会渲染一个 DOM 元素,也不会出现在父组件链中。当组件在 <keep-alive> 内被切换,它的 activated 和 deactivated 这两个生命周期钩子函数将会被对应执行。通过描述我们知道,它会缓存不活动的组件,而不是销毁。这样组件之间..原创 2021-08-29 14:05:06 · 557 阅读 · 0 评论 -
小程序-uni-app开发下,一些工具的使用
网络请求工具@escook/request-miniprogram由于平台的限制,小程序项目中不支持 axios,而且原生的wx.request()API 功能较为简单,不支持拦截器等全局定制的功能。因此,建议在 uni-app 项目中使用@escook/request-miniprogram第三方包发起网络数据请求。请参考@escook/request-miniprogram的官方文档进行安装、配置、使用官方文档:https://www.npmjs.com/package...原创 2021-08-29 13:50:21 · 807 阅读 · 0 评论 -
前端学习之路, 记录前端小白成长历程, 学习总结, 工具汇总, 打造开箱即用的学习体验
前端学习之路, 记录前端小白成长历程, 学习总结, 工具汇总, 打造开箱即用的学习体验常用js库汇总之前有很多人问学好前端需要学习哪些 js 库, 主流框架应该学 vue 还是 react ? 针对这些问题, 笔者来说说自己的看法和学习总结.首先我觉得在学习任何知识之前必须要有一个明确的学习目标, 知道自己为什么要学它, 而不是看网上说的一股脑的给你灌输各种知识, 让你学习各种库, 从而不断的制造大家的焦虑感.前端由于入行门槛低, 更新换代很快, 每年都会有大量新的框架和库出现, 也有大量库被淘汰(原创 2021-08-18 11:58:28 · 176 阅读 · 0 评论 -
Vue中computed和watch的区别,已经computed和watch的的使用场景
计算属性computed :支持缓存,只有依赖数据发生改变,才会重新进行计算不支持异步,当computed内有异步操作时无效,无法监听数据的变化.computed 属性值会默认走缓存,计算属性是基于它们的响应式依赖进行缓存的,也就是基于data中声明过或者父组件传递的props中的数据通过计算得到的值如果一个属性是由其他属性计算而来的,这个属性依赖其他属性,是一个多对一或者一对一,一般用computed如果computed属性属性值是函数,那么默认会走get方法;函数的返回值就是属性的属性值;在原创 2021-08-11 23:31:27 · 127 阅读 · 0 评论 -
Vue的优点,vue双向数据绑定的原理?
Vue的优点轻量级框架:只关注视图层,是一个构建数据的视图集合,大小只有几十 kb ;简单易学:国人开发,中文文档,不存在语言障碍 ,易于理解和学习;双向数据绑定:保留了 angular 的特点,在数据操作方面更为简单;组件化:保留了 react 的优点,实现了 html 的封装和重用,在构建单页面应用方面有着独特的优势;视图,数据,结构分离:使数据的更改更为简单,不需要进行逻辑代码的修改,只需要操作数据就能完成相关操作;虚拟DOM:dom 操作是非常耗费性能的,不再使用原生的 dom 操作节原创 2021-08-07 13:57:04 · 1152 阅读 · 0 评论 -
Element怎么进行From表单效验--完整版保姆教程
Element的表单校验补充我们尝试通过一个案例对Element的表单校验进行一下补充实现表单基本结构创建项目$ vue create login选择babel / eslint安装Element开发时依赖 : 开发环境所需要的依赖 -> devDependencies运行时依赖: 项目上线依然需要的依赖 -> dependencies$ npm i element-ui在main.js中对ElementUI进行注册import ElementUI from原创 2021-07-24 09:03:23 · 1033 阅读 · 0 评论 -
文章正文使用makdown的样式神器 github-markdown-css ,使用超简单,
关于文章正文的样式文章正文包括各种数据:段落、标题、列表、链接、图片、视频等资源。将 github-markdown-css 样式文件下载到项目中导入import './github-markdown.css'添加类名<div class="article-content markdown-body" v-html="article.content"></div>配置不要转换样式文件中的字号'postcss-pxtorem': { ro原创 2021-07-17 09:26:21 · 854 阅读 · 0 评论 -
取消某个组件的keep-alive缓存的方法
在使用keep-alive进行组件缓存时,会遇到某个组件不想进行缓存操作,或者只想某个组件进行缓存操作,这该怎么操作???include - 字符串或正则表达式。只有匹配的组件会被缓存。exclude - 字符串或正则表达式。任何匹配的组件都不会被缓存。<!-- 逗号分隔, 只有name 等于 a 和 b 的组件会被缓存 --><keep-alive include="a,b"> <router-view></router-view> &l原创 2021-07-16 19:04:11 · 729 阅读 · 0 评论 -
如何在记住滚动条的滚动位置,在切换其他页面时继续显示,本方法只适用于不刷新页面的情况
首先回忆一下overflow的属性有哪些visible:默认值。内容不会被修剪,会直接显示在在元素框之外。auto : 如果内容被修剪,则浏览器会显示滚动条以便查看其余的内容。滚动条会根据本标签内容是否被修剪而调整sroll : 内容会被修剪,但是浏览器会显示滚动条以便查看其余的内容,滚动条是一直显示不会消失的inherit : 从父元素继承 overflow 属性的值。hidden : 内容会被修剪,并且其余内容是不可见的。vw:1vw为视口宽度的 1%vh:1原创 2021-07-13 10:09:58 · 1002 阅读 · 3 评论 -
node.js的chttp库-axios默认接口基准路径的配置,以及axios请求拦截器的配置
axios请求拦截器是方便在某个个项目时,每次都有一个同样的请求,我们可以配置一个axios请求拦截器来方便我们的操作因为每次发起请求时,请求都回经过request.interceptors.request.use这里,所以在此配置,每次发起请求时都发起的附加参数import axios from 'axios'import store from '@/store'const request = axios.create({baseURL: 'http://ttapi.research.itcas原创 2021-07-13 09:20:53 · 252 阅读 · 0 评论 -
vue里面的计算属性computed和watch的区别,以及的计算属性和watch在什么场景下使用
1.计算属性和 watch 的区别计算属性是自动监听依赖值的变化,从而动态返回内容,监听是一个过程,在监听的值变化时,可以触发一个回调,并做一些事情。所以区别来源于用法,只是需要动态值,那就用计算属性;需要知道值的改变后执行业务逻辑,才用 watch,用反或混用虽然可行,但都是不正确的用法。说出一下区别会加分1.computed 是一个对象时,它有哪些选项?有get和se两个选项2.computed 和 methods 有什么区别?methods是一个方法,它可以接受参数,而comput原创 2021-07-12 14:14:54 · 568 阅读 · 0 评论 -
使用PostCSS做网页适配时,设计稿于vant组件默认px宽度不一致解决方法
/** * PostCSS 配置文件 */module.exports = { // 配置要使用的 PostCSS 插件 plugins: { // 配置使用 autoprefixer 插件 // 作用:生成浏览器 CSS 样式规则前缀 // VueCLI 内部已经配置了 autoprefixer 插件 // 所以又配置了一次,所以产生冲突了 // 'autoprefixer': { // autoprefixer 插件的配置 // //原创 2021-07-09 15:40:41 · 1138 阅读 · 0 评论 -
VUEX学习笔记-整理
VUEXVUEX学习笔记-整理※标题VUEX的作用组件之间可以更方便的共享数据进行数据管理更加方便(或者说是状态管理)为项目提供一个公共内存, 可以给这个内存提交数据, 也可以从内存中取数据1.0.0如何使用VUEX呢?- 1.0.1初始化Store对象 文件所在位置src/store/index.js( 如果使用脚手架直接生成的项目勾选了vuex的话基本上会直接生成以下内容)//关于store属性的介绍 export default new Vuex.Store({原创 2021-07-08 15:53:07 · 125 阅读 · 0 评论 -
vue组件插槽怎么用?vue组件插槽是什么?怎么使用?vue组件插槽最详细讲解
VUE组件插槽目标: 用于实现组件的内容分发, 通过 slot 标签, 可以接收到写在组件标签内的内容vue提供组件插槽能力, 允许开发者在封装组件时,把不确定的部分定义为插槽插槽例子:需求: 以前折叠面板案例, 想要实现不同内容显示, 我们把折叠面板里的Pannel组件, 添加组件插槽方式语法口诀:组件内用占位使用组件时夹着的地方, 传入标签替换slot03/Pannel.vue - 组件(直接复制)<template> <div> <原创 2021-07-08 09:24:03 · 1139 阅读 · 0 评论 -
vue怎么关闭严格模式?
vue的严格模式在初学者手中让人头大,那么如何关闭他呢?在项目根部录下创建vue.config.js文件module.exports = { lintOnSave: false //加入此行 , false为关闭true为开启}现在再次运行项目,查看是否经常报错?...原创 2021-07-06 11:04:45 · 3983 阅读 · 0 评论 -
VUE路由插件 router使用保姆级教程,VUErouter使用教程
知识点自测 url的组成部分都有哪些, hash值指的什么今日学习目标能够了解单页面应用概念和优缺点能够掌握vue-router路由系统使用能够掌握链接导航和编程式导航用法能够掌握路由嵌套和路由守卫能够掌握vant组件库基础使用1. vue路由简介和基础使用1.0 什么是路由目标: 设备和ip的映射关系[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-VKGro87g-1625490228254)(images/image-20210512095原创 2021-07-05 21:06:26 · 736 阅读 · 0 评论