rolinabc的博客

难点：1、不同类型组件对应的操作符有哪些？？？2、value组件展示形式，如何确定？？？3、如何定制operator的内容以及value组件？？等。。。。。。。组件收益：1、统一协议&场景2、快速接入。

这两个插件，乍一看很像，功能也是一致的——让vue支持jsx语法那么他们两到底有什么区别呢？ 这里就给大家详细说一说一、背景：在使用脚手架构建项目的时候，拉取下来的项目模版，不能够支持jsx的语法，通过排查发现项目使用的是@vue/babel-plugin-jsx，随即修改为@vue/babel-preset-jsx后即可以正常解析二、@vue/babel-plugin-jsx 该组件只适用于vue3.x使用：npm install @vue/babel-plugi..

前段时间偶然间发现组内有个项目打包后的体积非常的大，如下图所示， 这直接导致项目在部署的时候非常非常的慢，不夸张的说，喝完一杯茶了项目都没部署好，哈哈哈。真的非常影响开发体验，尤其对于博主这种总是冒火的脾气来说，每次部署都得‘骂骂咧咧’，啧啧啧。。。 所以决定，对它下手，优化一些比较刺头的包 首先第一步，找出对体积影响比较大的包，那么如何找出这些包呢？？？这里就需要引入个东西——report，不知道大家有没有见过下面这种五颜六色的图片呢？ 如果不知道那么，在这里告诉你...

一、Vssue介绍Vssue 是一个 Vue 组件 / 插件，可以为你的静态页面开启评论功能。由于你的页面是静态的，没有数据库和后端 的支持。但是你希望让你的页面拥有评论功能，让用户可以登录和发表评论。代码托管平台（如 Github、Gitlab）为你提供了 OAuth API ，Vssue 可以让用户通过这些平台的帐号登录，将评论存储在这些平台的 Issue 系统中，并在当前页面展示。这也是Vssue名字的由来：由Vue驱动并基于Issue实现二、Vssue特点Vssu...

我们平时在开发的时候，最常用的父子组件通信方式就是父组件绑定要传递给子组件的数据，然后子组件通过props属性接收。但是一旦组件层级变多时，采用这种方式一级一级传递值非常麻烦，而且代码可读性不高，不便后期维护。而且如果父组件内子组件较多，还需要对每一个子组件一一去绑定数据。 所以vue提供了provide和inject帮助我们解决多层次嵌套嵌套通信问题。在provide中指定要传递给子孙组件的数据，子孙组件通过inject就可以注入祖父组件传递过来的数据，不论组件层次有多深，始终生效。...

我们在做vue开发的时候,对import vue from 'vue'肯定是不陌生的但是有没有人具体思考过这个vue到底是什么,从哪里来以及我们使用vue报错的时候为什么指向的文件是vue.runtime.esm.js文件在这里的话,我就做一个简单的分享(菜鸟一只,如果不对,欢迎指正)首先,import vue from 'vue' 这个过程我们来看一下发生了什么首先import Vue from 'vue' 解析为 const Vue = require('vue')。 requir

我们都知道可以使用iframe可以把一个页面嵌套到另外一个页面内部进行显示,那么这两个页面如何进行传值交互呢, 下面我们就简单的来看一下 首先,新建两个文件,parant.html和child.html(在这里我使用的是vue语法哈~) 首先是将child.html的内容嵌入parent.html中,代码如下所示: <div id="app"> <iframeid="child" src="http://127.0.0.1:5500/...

写项目的时候遇到省市级联动, 使用的组件库是elementui,在这个组件库中没有直接给我们提供省市级联动的选择, 所以在这里给大家说一下, 如何去做1.安装npm install element-china-area-data --save-dev2.使用import { provinceAndCityData, regionData, provinceAndCityDataPlus, regionDataPlus, CodeToText, TextToCode } from ...

Websocket是一个持久化的协议，HTTP是不支持持久连接的Websocket其实是一个新协议，跟HTTP协议基本没有关系，只是为了兼容现有浏览器的握手规范而已比如说我们现在有个需求,实时获取一个网站当前的访问人数, 如果使用http协议去做的话,那我们要使用轮询,用定时器隔一秒查一次,这样的话非常的消耗我们的效率.这个时候就需要websocket了,也就是当数据发生改变的时候让后台主动把东西给我们,而不是从我们前台去要.下面用图来表示一下两种协议:简单的了解了websocket之.

想要学习nuxt.js，首先要弄清楚客户端渲染和服务端渲染这两个概念。客户端渲染 和 服务端渲染1. 客户端渲染 服务端只响应数据，不生成html页面。 浏览器负责发送请求 获取数据，得到响应后渲染成页面。 然后客户端从上到下依次解析，如果解析的过程中发现了新的ajax请求,那就再发送新的请求，等拿到ajax 响应结果以后再渲染模板引擎 如下图所示: 优点：服务端与客户端脱离开了，服务端只用写接口，不用进行html操作，html交...

本篇文章主要讲的是使用vue的框架 vue-element-admin, 来解决根据不同的角色权限, 显示不同的路由.⽅式⼀，后台返回⾓⾊树形路由表，前端添加动态路由⽅式⼆，后台返回⽤户⾓⾊，前端在路由表⾥添加⾓⾊路由权限下面详细的来讲一下,这两种方法:动态路由⽅式⼀ 后台返回⾓⾊树形路由表，前端添加动态路由。登录获 取到⽤户的信息之后，通过⽤户⾓⾊访问后台接⼝获取动态路由，依赖后台接⼝返回路由表 后台数据样例如下: const servic...

data中定义一个对象：data(){ return{ obj:{ name:'tom', age:24, gender:'男' } }}例如现在我想要监听obj中的name和age属性,那么此时,首先在计算属性中,筛出一个新的对象computed:{ 'newObj':function(){ const {name,age} = this.obj

在前面的博文里我说到了提交文件到文件服务器, 也说到了以base64格式上传文件,那么本文就讲下以文件流的形式提交文件数据 在我们的原生表单中,提交文件很简单, 只需要将 enctype设置为multipart/form-data就可以实现提交了,但是在vue项目中,使用elementui中的表单组件,就不能够通过设置enctype来实现了. 首先看一下我们的表单代码,如下: <el-form :rules="rules" ref="form...

在我们开发的过程中,总会遇到上传的问题,如果不使用文件服务器的话,那么就需要我们对文件进行编码,然后发送给后台. 当然,后台也会给我们传送base64编码的文件或者是图片.最近的项目中就用到了base64编码,也是第一次写, 做为经验分享给你们. 那下面我们就来说一下base64编码在vue项目中的使用吧 html代码,此处用的是element-ui中的上传组件: ...

在上篇博客中,介绍了如何在vue项目中集成百度地图,这篇博客主要是说如何在vue项目中使用轨迹动画 在项目开发过程中,比如你需要实时的观察一个人的行走路线,行走过程. 这个时候我们就需要在地图上使用轨迹动画了,根据不同的坐标点来设置人物或者车辆的行走轨迹. 具体代码如下:<template> <div class="patrol_area"...

本篇文章主要讲述, 如何在vue项目中集成百度地图 1.首先找到你项目底下的index.html入口文件,这个根据不同的版本,所以存在的位置是不同的,具体如下: a.路径如下: 项目名/public/index.html b.路径如下: 项目名/index.html 找到index文件后,导入百度地...

在我们使用vue-element-template框架开发的过程中, 肯定会遇到框架的登录问题 1.项目打包后默认登录有问题,登录不了 因为框架的数据是其自身的mock模拟出来的,而mock是部署在9527端口上的,而项目打包之后就不会运行在9527端口上了,所以打包后会出现登录不了这个问题 解决方式:第一，修改前端中登录的代码，实现不登录也能跳转主页。...

在我们对vue项目进行打包的时候,会遇到一些组件问题,比如说分页组件的箭头,下拉框组件的箭头打包完成后会出现方框显示的问题.具体解决办法如下:1.找到项目底下build/utils.js文件2.添加 publicPath: '../../'完成后再进行项目打包就可以了...

之前写了一个项目,涉及到文档和视频的上传.需求大概是这个样子,拿上传视频举例子吧,首先是将选择的视频上传到文件服务器上,接着文件服务器会返回视频的存储链接还有视频名,在后面保存视频的时候会用到这两个参数的.另外,上传成功的视频名字要显示在左侧,并且是可以修改的.视频上传成功后,还可以给相应的视频添加附件,也就是和视频配对的文档(注意,这里巨恶心).首先是要给当前视频加,其次添加文档的时...