![](https://img-blog.csdnimg.cn/20201014180756918.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
vue
深入vue的每个生命周期
开源字节
致力于企业智能管理软件的策划、定制与研发
展开
-
租房小程序登顶码云热门
众所周知,开源技术的大热往往预示着技术的热潮,码云发展至今,越来越多的开源作者选择在上面开源自己的作品,也希望通过码云每周最热门开源项目了解国内技术走向。原创 2022-08-04 15:28:04 · 304 阅读 · 0 评论 -
handsontable日期控件汉化的问题
在项目的 node_modulespikaday目录下打开 pikaday.jsi18n: { previousMonth : 'Previous Month', nextMonth : 'Next Month', months : ['January','February','March','April','May','June','July','August','September','October','November','December'],原创 2022-04-12 17:34:56 · 296 阅读 · 0 评论 -
vue-handsontable常用配置项
hotSettings : { data: this.objectData, // data: HandsontablePro.helper.createSpreadsheetData(100, 50), // data: this.getDate(), width: 800, // 宽 height: 350, // 高 // 标题操作 .原创 2022-04-12 17:26:48 · 2360 阅读 · 0 评论 -
使用vue-handsontable实现web execl编辑
npm install --save vue-handsontable-official<template> <div class="wrap"> <HotTable :root="test" :settings="hotSettings"></HotTable> </div></template><script>import HotTable from 'vue-handsontable-o.原创 2022-04-12 17:00:35 · 982 阅读 · 0 评论 -
什么是404页面?
官方解释:就是有的网址你点击过去,因为某些原因是死链接(可能也是无意的),死链接在搜索引擎眼中是很差的评价。 所以我们就做一个页面,叫做“404页面”,这样任何死链接打开都是404页面,对用户相对较好,这样对蜘蛛的友好度就没有问题。我们认为:你的网站已经收录的情况下,假如网站更改域名,每次更改栏目,更改栏目URL,删除文章等,就会产生死链接,错误链接,空链接等。因为百度spider以前记录的在百度数据库存贮的URL路径,仍会存在,且按照以前的URL路径来了,发现你已经变动了,找不到了,就出错了,原创 2022-03-28 23:23:47 · 964 阅读 · 0 评论 -
vue3 element-plus使用
先下载往期vite project项目直接开始安装npm i element-plus 为了方便,直接采取全部引入的方式src/plugins/element.tsimport ElementPlus from 'element-plus'import 'element-plus/lib/theme-chalk/index.css'export default (app: any) => { app.use(ElementPlus)}src/main.ts原创 2022-03-15 14:08:39 · 801 阅读 · 0 评论 -
vue3 数组清空与重新赋值
vue3里面,如果数组是用reactive()声明的,要清空数组得用list.length = 0,如果想要使用list =[],或者直接赋值类型list = [1,2,3,4,5],得把数组用ref([])来声明,然后用list.value = []来修改,然后如果是对象里面的数组,可以直接使用obj.list = []来清空,因为obj已经被响应式了.<template> <div> {{list}} <button @click="add">原创 2022-03-06 16:10:29 · 18464 阅读 · 1 评论 -
quill(vue-quill-editor) 编辑器中莫名多出一行
在使用 vue-quill-editor 富文本编辑器过程中,加载已有的富文本数据到编辑器,经常会出现编辑器中莫名其妙多出一段换行内容 <p><br></p>(一般出现在段落与其他内容之间,例如标题,引用,列表),每次重新编辑之前的内容时都必须手动删除这些空行,否则这些换行就会越积越多。这让我们的文案小伙伴很不开心。问题必须得解决,否则就又要换编辑器了。先尝试直接使用 DOM 设置 innerHtml 进行设置原始内容,发现没有成功(在浏览器控制台可以成功,但是.原创 2022-03-02 15:16:50 · 1595 阅读 · 0 评论 -
elementui table 序号列自动增长
复选框后面一列放置序号<el-table-column label="序号" type="index" width="50" align="center"> <template scope="scope"> <span>{{(page - 1) * pageSize + scope.$index + 1}}</span> </template>.原创 2022-03-02 09:24:10 · 720 阅读 · 0 评论 -
Vue-Quill-Editor
基于 Quill、适用于 Vue 的富文本编辑器,支持服务端渲染和单页应用。ExampleComponent example page CDN example pageInstallNPMnpm install vue-quill-editor --save# oryarn add vue-quill-editorCDN<link rel="stylesheet" href="path/to/quill.core.css"/><link rel="s原创 2022-02-28 10:59:38 · 737 阅读 · 0 评论 -
uniapp,在一个方法内调用另外一个方法提示我undefined ?如何解决?
原因:this的指向不正确。解决办法:在 export default 外面 定义一个变量: 同时在created(){}函数中把this的值赋值给他通过_self.函数名称即可以调用到这个函数。原创 2022-02-28 10:54:02 · 2785 阅读 · 0 评论 -
若依富文本样式丢失
进入页面,富文本编辑框里回显这条新闻内容,如下图, 然后可以在富文本编辑框里对它实现再编辑,编辑之后将html代码提交保存到后台数据库。可以点击详情页进行查看。出现问题:在提交到后台controller时, 莫名被过滤了很多东西, 包括CSS、class等,只剩下div标签和文本内容了,哇呀呀!二.解决只需一段代码即可搞定,如图:默认防止XSS攻击是开启的,我们只需要将排除的链接添加到这里就可以了该方法是防止XSS攻击的后端处理方式,目的是防止js等恶意代码直接被存储到数据库中。所以我们存储到后原创 2022-02-27 20:32:43 · 1054 阅读 · 0 评论 -
Source-Vue 开源字节快速开发平台
一直想做一款快速开发平台,看了很多优秀的开源项目但是发现没有合适的。于是利用空闲休息时间开始自己写了一套快速开发系统。如此有了开源字节。原创 2022-01-19 10:22:37 · 1094 阅读 · 0 评论 -
若依登录界面美化
效果图如下:代码如下:<template> <div class="login"> <div class="login-logo"> <span> 开源字节 | 通行证</span> </div> <h2 class="main-title"><span>开源字节</span></h2> <h3 class="sub.原创 2022-01-19 09:54:33 · 5932 阅读 · 7 评论 -
vue3生成二维码
需求:前端生成二维码,且生成的二维码中间可以放头像选择使用vue-qr二维码插件官网:https://www.npmjs.com/package/vue-qr安装命令npm i vue-qr或npm install vue-qr --save导入项目中使用<template> <vue-qr :text="downloadData.url" :margin="0" colorDark="#f67b29" colorLight="#fff" :logoSrc=原创 2022-01-14 10:59:49 · 884 阅读 · 0 评论 -
uniapp 404页面
需求:uniapp 在写 H5 时,如果在地址栏乱输入,会跳转到 404 页面。思路:uniapp 有个 应用生命周期 onPageNotFound,让跳转不存在的页面时会执行这个回调函数。所以需求就很好解决了!具体操作:第一步:写一个 404 页面,并在 pages.json 中配置其路由。第二步:在 App.vue 的 onPageNotFound 生命周期中处理跳转到 404 页面的逻辑:// App.vue 文件:export default { onPageNot原创 2022-01-14 10:01:13 · 1131 阅读 · 0 评论 -
vue3 clipboard
vue 3 的复制功能 vue-clipboard3npm install --save vue-clipboard3import useClipboard from "vue-clipboard3";const { toClipboard } = useClipboard();function shareLink() { toClipboard("复制成功"); proxy.$msg.success("复制成功");}原创 2022-01-11 20:31:24 · 2019 阅读 · 0 评论 -
Vue3 企业级网站建设
## 基于Vue3 企业级网站建设项目地址:http://8.136.213.245***温馨提醒***1. 本项目仅适用于学习交流,并且`不提供无偿的`、 `不提供无偿的`、 `不提供无偿的` 维护修改服务(但可提issue)***2. 本项目不在任何平台出售,如有发现请积极举报!3. 为更好的用户体验,尽情反馈问题***不要只是白嫖 ,如果帮到你了麻烦点个star***> 发现有问题?欢迎加入下方交流群一起探讨,或者直接提Issues### 什么是vue?Vue.原创 2022-01-10 14:16:54 · 4054 阅读 · 3 评论 -
vite.config.js与nginx配置代理
vite.config配置server: { port: 9090, cors: true, // 默认启用并允许任何源 open: true, // 在服务器启动时自动在浏览器中打开应用程序 //反向代理配置,注意rewrite写法 proxy: { "/api": { target: "http://xx.xx.xx.x1:8090", //代理接口 changeOrigin: true, rewri.原创 2022-01-09 17:25:31 · 3951 阅读 · 0 评论 -
解决elementui plus 设置导航栏置顶不生效问题
// 跳转路由后导航栏置顶 scrollBehavior(to, from, saveScrollPosition) { // console.log(document.documentElement.querySelector(".el-main").scrollTop); // 通过此方法去改变elementui滚动条高度 document.documentElement.querySelector(".el-main").scrollTop = 0; ..原创 2022-01-06 21:46:44 · 1095 阅读 · 0 评论 -
vue分享给QQ好友,QQ空间,微博
<script setup lang="ts">//分享到QQ好友(PC端可用)//自定义内容const share = { title: '分享测试', desc: '测试描述', image_url: [ 'https://pic3.zhimg.com/80/v2-ab0718575cc9337b24bfc7578f5e6d32_720w.jpg', ], share_url: 'https://xiucai.neafex.com/#/',}funct.原创 2022-01-06 15:02:00 · 1077 阅读 · 2 评论 -
vue3.x整合vuex
vue3.x整合vuex原创 2022-01-05 15:02:32 · 547 阅读 · 0 评论 -
vue3.x整合axios实现路由埋点
vue3.x整合axios原创 2022-01-05 14:29:36 · 588 阅读 · 0 评论 -
vue3 路由设置滚动条置顶
const router = createRouter({ history: createWebHistory(), routes, // 跳转路由后导航栏置顶 scrollBehavior(to, from, saveScrollPosition) { return { left: 0, top: 0 }; },});原创 2021-12-27 19:46:13 · 831 阅读 · 0 评论 -
vue3 build vite.config.ts配置
import { defineConfig } from 'vite'import vue from '@vitejs/plugin-vue'const path = require('path') // npm i --save-dev @types/nodeexport default defineConfig({ plugins: [vue()], // 配置需要使用的插件列表,这里将vue添加进去 // 打包配置 build: { target: 'modules',.原创 2021-12-22 16:01:03 · 3514 阅读 · 1 评论 -
vue3整合router,配置路由守卫实现404拦截
废话不多说,直接上代码router index.tsimport { createRouter, createWebHashHistory, createWebHistory, ErrorHandler,} from 'vue-router'// 引入路由守卫方法import beforeEach from './beforeEach'const home = () => import('../components/Home.vue')const login = (原创 2021-12-22 15:59:19 · 2515 阅读 · 0 评论 -
vue3使用animate
直接上代码npm install animate.css@3.5.1 --save在main.js中引入import 'animate.css/animate.min.css' //引入在Vue视图中使用<div class="animated zoomIn"> animate测试</div>附上常用的动画效果fade: { title: '淡入淡出', fadeIn: '淡入', fadeInDo原创 2021-12-17 16:40:46 · 1185 阅读 · 0 评论 -
vue3+ts极简教程
一、依次执行以下四步,即可极速创建项目,跟着敲一次,你会放下2.x1.npm init @vitejs/app my-vite-vue2.cd my-vite-vue3.npm install4.npm run dev二、通过两种不同方式编写简单组件与方法,推荐方式一,编码高效App.vue<script setup lang="ts">import HelloWorld from './components/HelloWorld.vue'</script>原创 2021-12-17 15:05:55 · 1475 阅读 · 0 评论 -
uniapp开发相亲平台
### 介绍使用uniapp开发的相亲平台### 说明此项目是一个招商项目,目前已完成前台开发。源码结构清晰,完美实现模块化组件化思想,易维护。### 关于我们曾经,作者也为寻求自己的另一半苦恼,因为平时工作繁忙,交际圈窄小,而父母又各种催婚,无奈上了“XX网”去碰碰运气。好不容易,在它的相亲资料库里看到自己心仪的对象,于是找红娘前去索要联系方式,被告知至少需要交1280元会员费(半年为期,可自由选择12个会员编号)。尼玛,虽说现在是知识付费时代,但这也太贵了,对于工薪阶层的我来说,可是一原创 2021-12-14 15:38:11 · 1030 阅读 · 2 评论 -
uniapp+若依 开发租房小程序
两情若是长久时,又岂在朝朝暮暮,心爱的就要跟大家分享uniapp+若依 开发租房小程序介绍多端适用的租房小程序-带管理员后台项目地址:http://8.136.213.245:8080/h5/联系作者:进入项目-》我的-》技术支持如需小程序定制「包括但不限于课设、毕设等」可联系我;温馨提醒本项目仅适用于学习交流,并且不提供无偿的、 不提供无偿的、 不提供无偿的 维护修改服务(但可提issue)***本项目不在任何平台出售,如有发现请积极举报!为更好的用户体验,可进入项目-》我原创 2021-10-15 16:35:57 · 3148 阅读 · 2 评论 -
HbuilderX连接夜神模拟器
进入夜神bin目录执行命令:nox_adb.exe connect 127.0.0.1:62001原创 2021-08-27 15:22:47 · 107 阅读 · 0 评论 -
为什么使用Uniapp
优势 跨端:一套代码可以发布到小程序,app,h5三个端。目前支持几乎所有平台的小程序 只需掌握Vue语法即可,上手极快 不需要app原生开发程序员了。注意: 原生app性能有高要求可以选择nvue的方案 小程序性能甚至比原生更好(在都不极限优化的情况下) 有独立的各端兼容写法(不同端安卓苹果可能依然会有2套代码,内置编译器会进行处理) 依赖原生组件库,安卓苹果组件依然会表现不一致 支持离线云打包,本地打包需要配置环境个人认为:做一...原创 2021-08-25 09:31:11 · 430 阅读 · 0 评论 -
什么是路由(route)?
在web开发中,“route”是指根据url分配到对应的处理程序。✔路由通过对url的进行分层解析获取资源。✔第一层 解析到服务器目标机器。这个通常是域名或ip。✔第二层 解析到服务器的特定资源文件。这个通常是path。✔第三层 解析特定资源的特定状态。这个通常是parameter。...原创 2021-08-23 16:38:30 · 1347 阅读 · 0 评论