一、准备工作：首先使用vue-cli搭建一个空的vue项目，步骤见。二、单页面改造多页面操作步骤：1、目录调整：对src目录进行一些调整：调整前是这样的： （1）进入src文件夹中，新建一个文件夹，如取名pages，用于存放后面的多页面，在pages里面新建一个文件夹叫index用于存放首页，然后将下图红框内的文件(文件夹)都拉进in
转载
2024-04-13 10:09:42
988阅读
文章目录问题描述解决思路将数组转为JSON对象将上面的方法封装，方便以后重复使用根据JSON对象递归Vue对象 Vue2.x 组件递归（tree展示）问题描述最近要做一个通信面板，后台返回一个数组，标明了ID和PID的字段根据后台返回的数据需要转为一个机构用户信息树解决思路将后台返回的数组转换为一个上下层级关系的JSON对象根据JSON对象递归生成一个Tree组件将数组转为JSON对象<!
element：VUE2的web UI工具 mint-ui：VUE 2中的移动UI iview：VUEjs 的开源 UI 库 muse-ui：响应式 UI 库 VUECircleMenu：VUE圆环菜单 VUE-chat：聊天示例 VUE-waterfall：瀑布组件 Keen-UI：基本UI组件 Vux：基于VUE和WeUI的组件库 VUE-carbon：MD风格的移动端 VUE-blu：帮助创
效果1、右击弹出列表，同时保存消息id 2、选择转发成员，转发即可 注意：转发对象可为当前聊天对象，转发成功后需判断是否是存在转发当前聊天，是的话把消息数据显示右击事件处理//右击事件处理
rightMessageClick(e, msgId, uid) {
console.log('右击事件');
this.withdrawMessageSmgId =
转载
2024-07-15 15:01:48
924阅读
VUE 配置history路由模式配置vue-router 默认 hash 模式 —— 使用 URL 的 hash 来模拟一个完整的 URL，于是当 URL 改变时，页面不会重新加载。如果不想要很丑的 hash，我们可以用路由的 history 模式，这种模式充分利用 history.pushState API 来完成 URL 跳转而无须重新加载页面。const router = new VueR
第一步：使用vue-cli搭建项目（注：建议安装淘宝镜像，使用cnpm执行下面操作） 1.按住shift按钮，右键点击存放项目的文件夹，点击在此处打开命令窗口。 2.在命令窗口中输入 npm install -
转载
2024-08-01 09:33:07
152阅读
nginx配置nginx启动、停止、重新加载配置要启动nginx需要运行可执行文件，nginx通过 nginx - s 指令名 调用可执行文件。nginx -s stop 快速关机nginx -s quit 优雅关机nginx -s reload 重新加载配置文件nginx -s reopen 重新打开日志文件nginx配置文件的结构nginx由模块组成，这些模块由配置文件中
router刷新这种方法页面会一瞬间的白屏this.router.go(0)location这种也是一样，画面一闪location.reload()以上整个浏览器进行了重新加载，闪烁，体验不好provide/inject允许一个祖先组件向其所有子孙后代注入一个依赖，不论组件层次有多深，并在起上下游关系成立的时间里始终生效。provide：选项应该是一个对象或返回一个对象的函数。该对象包含可注入其子
原创
2021-10-27 16:11:39
810阅读
VUE2单页面引用axios
Vue 是一个用于构建用户界面的渐进式框架，而 Axios 是一个基于 Promise 的 HTTP 客户端，用于浏览器和 Node.js。一些开发者在使用 Vue 2 时可能会遇到在单页面应用（SPA）中引入 Axios 的问题。本文将详细记录如何在 Vue2 单页面应用中引用 Axios 以及解决这一问题的全过程，涉及版本对比、迁移指南、兼容性处理、实战案例、排
Vue+Element-ui快速搞定前端登录页面
原创
精选
2023-07-13 14:20:54
1518阅读
监听是否离开页面是否锁屏，里面script用vue2的官方文件代替<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
&l
原创
2023-09-06 09:35:15
155阅读
由于很长时间没有使用
vue了，版本一直在更新，正好现在有时间再整理一下语法使用。下面直接包括（子传父，父传子，slot，sessionStorage（会话数据储存）），直接给上代码父组件<template>
<div class="about">
<h1>This is an about page</h1>
&
现在的很多应用都流行SPA应用（singe page application) 。
传统的项目大多使用多页面结构，需要切换内容的时候我们往往会进行单个html文件的跳转，这个时候因受到网络、性能的影响，浏览器会出现不定时间的空白界面，用户体验不好。而单页应用则是用户通过某些操作更改地址栏url之后，动态的进行不同模板内容的无刷新切换，用户体验好。而在vue2.0版本后，vue官方推出vue-rou
使用 1.v-touch 实现滑动效果，父级页面滑动，当父级含有子页面需要滑动功能hasClass("sm_img"），需要判断是否继续父级滑动，有的话子页面先滑动，通过upB去判断 if($(imgShowChild[that.childNum]).children().children().hasClass("sm_img")&&that.upB !=3)
2.
前言vue-cli , vue-router , vue-resource , vuex 1.使用vue-cli创建项目 2.使用vue-router实现单页路由 3.用vuex管理我们的数据流 4.使用vue-resource请求我们的node服务端 5.使用.vue文件进行组件化的开发 PS：本文node v6.2.2 npm v3
vue项目实现详情页后退缓存之前的数据 一、需要缓存的内容：1、后退缓存条件查询的数据2、后退缓存分页信息二、实现通过参考网上搜集的资料知道用keepAlive实现参考地址：1、在路由文件router.js中针对要缓存的页面进行设置添加keepAlive: true，通过此字段判断是否需要缓存当前组件添加keepAlive: true，通过此字段判断是否需要缓存当前组件2、在app.vue
转载
2024-09-30 10:42:39
43阅读
vue项目中的配置 以vue-cli搭建的项目为例, 在webpack配置文件 /config/index.js, 由于我们是在开发环境下使用，自然而然是要配置在dev里面,找到 proxyTable属性,配置如下:dev: {
// Paths
assetsSubDirectory: 'static',
assetsPublicPath: '/',
proxyT
转载
2024-07-19 22:43:23
360阅读
Vue笔记六：Vue项目的性能优化之路“你说一下性能优化的手段”。百分之八十的人都会说，压缩js和css之类的。显然这些都是必须做的，而且已经根本不是主要的性能优化的关键点。如果你只会说这些，只能说明你是个过时的前端工程师。性能优化过程中，我们需要面对的更多是DMS解析过程，服务器缓存和浏览器缓存机制。gzip压缩在所有的web前端项目，静态资源基本都放在cdn上，gzip的压缩是非常必要的，
跨域设置 http://www.ituring.com.cn/article/200275 打包 npm adduser 如果长时间不登录，可能会过期，使用 npm login 进行登录就可以 pu
原创
2021-07-23 11:32:15
391阅读
eslint用于代码检查，prettier用于代码格式化，具体操作如下1.安装以下eslint插件
安装以下eslint插件，并增加.eslintrc.js配置文件，.eslintignore配置忽略检查的文件（1）eslint
用于检查和标示出ECMAScript/JavaScript代码规范问题工具。
（2）@babel/eslint-parser
简而言之就是一个解析器，允许您使用ES
转载
2024-05-29 12:57:59
283阅读
