Vue
面向数据的前端框架
gblfy
心如向阳,次第花开!
展开
-
运行npm报错peer eslint-plugin-vue@“^7.0.0“ from @vue/[email protected]
--legacy-peer-deps原创 2023-07-23 14:21:56 · 734 阅读 · 0 评论 -
Error: Command failed: C:\windows\system32\cmd.exe /s /c “./configure
Error: Command failed: C:\windows\system32\cmd.exe /s /c “./configure原创 2023-03-16 14:42:36 · 647 阅读 · 0 评论 -
vue将json字符串转换为数组_json字符串、json对象、数组 三者之间的转换
vue将json字符串转换为数组_json字符串、json对象、数组 三者之间的转换原创 2022-11-11 16:27:16 · 3617 阅读 · 0 评论 -
yarn 不是内部或外部命令,也不是可运行的程序(亲测可用)
yarn 不是内部或外部命令原创 2022-11-06 09:08:21 · 712 阅读 · 0 评论 -
Module build failed: Error: Cannot find module ‘gifsicle‘
Module build failed: Error: Cannot find module 'gifsicle'原创 2022-08-31 14:13:09 · 569 阅读 · 0 评论 -
vue获取url地址中的参数
vue获取url地址中的参数原创 2022-08-13 17:01:16 · 3353 阅读 · 0 评论 -
vue PC端国际化一站式解决方案
红色部分已处理,蓝色部参考处理方式,进行处理即可,暂未处理文章目录1. 参考项目2. 实现思路3. 关键步骤1. 参考项目参考:https://github.com/linjinze999/vue-llplatform2. 实现思路前端部分:国际化分2部分进行,参考文档https://linjinze999.github.io/vue-llplatform/docs/project/language.html数据库部分:不用返回具体的菜单对用的值,只需返回类似下面这种对应...原创 2022-02-20 18:04:23 · 929 阅读 · 0 评论 -
Refusing to install package with name “vue-i18n“ under a package
npm install vue-i18n时出现标题的报错,原因:vue create vue-i18n创建的项目名称为vue-i18n和要安装的包vue-i18n冲突了,修改项目名称即可解决原创 2022-02-19 09:36:23 · 330 阅读 · 0 评论 -
vue中forEach循环的使用
//data为集合 data.forEach(function(item, index) { //item 就是当日按循环到的对象 //index是循环的索引,从0开始})//定义班次详细数组 var bcglxiangxiList = new Array(); //定义班次详细对象 var bcxiangxi = {}; //循环传递的参数 bcglXiangXiListParam.forEach(element => {原创 2022-01-16 22:40:41 · 4999 阅读 · 1 评论 -
基于 vue 2.0 开发的轻量,高性能日历组件
文章目录1. 安装scss2. 安装日历组件3. 安装提示组件4. 注册组件5. 页面6. 效果图1. 安装scssnpm i -D [email protected] i [email protected]. 安装日历组件npm i vue-calendar-component --save3. 安装提示组件npm install --save vue-component-toast4. 注册组件main.jsimport toast from 'vue-componen.原创 2022-01-21 22:16:36 · 1198 阅读 · 0 评论 -
Syntax Error: TypeError: this.getOptions is not a function
出现问题场景:vue运行项目过程中报错检查代码中并无写错的地方其实涉及到这个问题,就是版本原因了,我安装的 scss-loader 版本太高,卸载安装低版本即可npm uninstall --save sass-loader // 卸载npm uninstall --save node-sass // 卸载npm i -D [email protected] // 安装npm i [email protected] // 安装// 如果node-sass安装失败,也可以直接在package.j原创 2022-01-21 21:26:18 · 527 阅读 · 0 评论 -
JS向数组添加元素,插入数据
js中对于数组的操作很常见,下面记录一下js向数组添加元素的方法。 let myArray=[11,22,33]; console.log('原数组:',myArray); myArray.push(44,55); console.log('用push在数组后面插入元素:',myArray); myArray.unshift(66,77); console.log('用unshift在数组前面插入元素:',myArray); myArray.splic原创 2022-01-21 12:56:03 · 4127 阅读 · 0 评论 -
js获取数组中最大和最小值
// 数组中获取最大和最小值 compareMaxMin() { const arr = [12, 56, 25, 5, 82, 51, 22, 100, 2]; arr.sort(function (a, b) { return a - b; }); // [5,12,22,25,51,56] const min = arr[0]; // 5 console.log("最小值->min", min) ...原创 2022-01-21 12:52:17 · 1400 阅读 · 0 评论 -
npm 设置淘宝镜像和查看镜像设置
将npm设置为淘宝镜像:npm config set registry https://registry.npm.taobao.org查看cnpm镜像设置:npm config get registry原创 2021-12-17 21:04:09 · 644 阅读 · 0 评论 -
‘yarn‘ 不是内部或外部命令,也不是可运行的程序
npm install -g yarn原创 2021-09-18 23:11:05 · 225 阅读 · 0 评论 -
vue中设置height:100%无效的问题及解决方法
在vue.js中写新的components的时候,如果在新页面中的模板中设置height:100%的时候一直无效,在App.vue中:<template> <div id="app"> <router-view/> </div></template><script>export default { name: 'App'}</script><style>#app {原创 2021-05-02 09:44:00 · 850 阅读 · 0 评论 -
前后端跨域解决方案
CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.package com.jiawa.wiki.config;import org.springframework.context.annotation.Configuration;import org.springframework.web.cors.CorsConfiguration;import org.sprin原创 2021-04-19 18:50:18 · 200 阅读 · 0 评论 -
vue3数据绑定显示列表数据局
文章目录一、第一种ref1. 案例代码2.页面使用二、第一种reactive,toRef2.1. 案例代码2.2. 页面使用一、第一种ref1. 案例代码<script lang="ts">import {defineComponent, onMounted, ref} from 'vue';import axios from "axios";export default defineComponent({ name: 'Home', setup() { // 定原创 2021-04-19 18:36:47 · 449 阅读 · 1 评论 -
wangeditor 使用
富文本编辑器官网:https://www.wangeditor.com文档地址:https://doc.wangeditor.com# 安装wangeditornpm i wangeditor --save# 引入import E from "wangeditor"# 初始化const editor = new E("#div1");# 创建editor.create();# 获取元素editor.txt.html();注:要注意创建的优先级,举个例子:如果富文本编辑器.原创 2021-04-19 18:16:44 · 477 阅读 · 0 评论 -
Ant-Design-Vue 安装
Ant-Design-Vue官网:https://2x.antdv.com/components/layout-cn# 安装ant-design-vue最新版 npm install ant-design-vue --save# 安装ant-design-vue 指定版本 npm install [email protected] --save # 配置 ant-design-vueimport Antd from 'ant-design-vue';import 'ant-des.原创 2021-04-19 18:07:40 · 2328 阅读 · 1 评论 -
Vue CLI 安装
前提:安装vue/cli之前要先安装nodejsnodejs官网:https://nodejs.org/en/Vue CLI官网:https://cli.vuejs.org/zh/# 安装最新版本vue/clinpm install -g @vue/cli# 安装指定版本vue/clinpm install -g @vue/[email protected]# 查看vue/cli版本vue --version# 使用vcli创建web项目vue create web# 进入项目cd we.原创 2021-04-19 18:03:21 · 179 阅读 · 0 评论 -
Vue3.x 使用ref和reactive、toRef
文章目录一、使用ref1. 引入2. 定义ref变量3. 赋值+.value4. return 返回值5. 将数据渲染到页面二、使用reactive 和 toRef1. 引入2. 定义reactive变量3. 赋值变量.对象4. return 返回值5. 将数据渲染到页面三、效果图+源码3.1. 效果图3.2. 源码一、使用ref1. 引入从vue里面引入ref函数import {defineComponent, onMounted, ref} from 'vue';2. 定义ref变量从vu原创 2021-03-26 09:24:00 · 1608 阅读 · 1 评论 -
vue-cli-service不是内部或外部命令,也不是可运行的程序
报错信息: “不是内部或外部命令,也不是可运行的程序”步骤一: 检查package.json 中是否有 vue-cli-server,没有则需安装步骤二 : 执行npm install命令npm run serve原创 2021-03-24 20:57:42 · 3066 阅读 · 0 评论 -
Vue Cli 项目结构简述
web node_modules --Vue Cli 项目以来的js模块全放到这里 public --存放静态资源 存放自己的js css favicon.ico -- 浏览器小图标 index.html --主页面 引用静态资源src --vue存放代码的地方 assets --存放静态资源 logo.png --登陆logo components --存放vue组件 HelloWorld.vue --原创 2021-03-24 08:58:14 · 159 阅读 · 0 评论 -
Vue-cli 3.X 构建工具零基础快速上手
文章目录一、环境准备1. 安装node2. 配置镜像二、安装Vue CLI2.1. 查看当前vuecli版本2.2. 安装最新版本2.3. 安装指定版本三、创建web项目3.1. 指定创建的项目名称3.2. 安装序列图3.3. 安装序列图简述一、环境准备声明:命令均在在cmd窗口执行1. 安装node2. 配置镜像# 显示当前的镜像网址npm get registry# 使用淘宝的镜像网址npm config set registry https://registry.npm.taob原创 2021-03-23 23:20:34 · 240 阅读 · 1 评论 -
基于SpringBoot+Vue开发的前后端分离博客项目-Java后端接口开发
作者:吕一明项目代码:https://github.com/MarkerHub/vueblog项目视频:https://www.bilibili.com/video/BV1PQ4y1P7hZ/1. 前言从零开始搭建一个项目骨架,最好选择合适,熟悉的技术,并且在未来易拓展,适合微服务化体系等。所以一般以Springboot作为我们的框架基础,这是离不开的了。然后数据层,我们常用的是Mybatis,易上手,方便维护。但是单表操作比较困难,特别是添加字段或减少字段的时候,比较繁琐,所以这里我推荐...转载 2020-06-06 11:10:18 · 2584 阅读 · 1 评论 -
安装Vuecli新版本正常,但是显示版本是低版本
安装最新版Vuecli:npm install -g @vue/cli查看版本vue --version如果出现bash: vue: command not found请参考:https://blog.csdn.net/weixin_40816738/article/details/106151054如果版本显示是低版本的找到本地仓库,进入到这个目录下面执行命令查看是否正常,如果正常,那就配置环境变量即可桌面验证配置是否成功...原创 2020-06-05 10:38:31 · 1462 阅读 · 0 评论 -
promise
asyncawait原创 2020-05-20 15:39:07 · 205 阅读 · 0 评论 -
bash: vue: command not found
安装Vuecli正常npm install -g @vue/cli查看vue版本,抛出bash: vue: command not found vue --version解决方案1:在这个目录下面执行命令正常,那就配置环境变量即可原创 2020-05-15 22:43:24 · 2896 阅读 · 0 评论 -
Vue项目 全局定义日期时间方法处理
在main-dev.js和main-prod.js中定义// 全局定义时间函数Vue.filter('dataFormat', function (originVal) { const dt = new Date(originVal) const y = dt.getFullYear() const m = (dt.getMonth() + 1 + '').padStart(2, ...原创 2020-04-07 23:00:58 · 1908 阅读 · 0 评论 -
Vue优化策略_项目上线_02
文章目录一、通过node创建web服务器1. 创建文件夹2. 初始化包管理配置文件3. 安装express插件4. 复制vue打包后dist5. 创建app.js+配置6. 运行项目并浏览器访问二、开启gzip配置2.1. 安装插件2.2. 配置插件2.3. 运行项目并浏览器访问三、使用pm2管理应用3.1. pm2常用命令3.2. 安装pm23.3. 使用pm2启动项目3.4. 使用pm2 ...原创 2020-04-07 17:53:22 · 232 阅读 · 0 评论 -
Vue优化策略_项目发布_01
文章目录1. 生成打包报告1. 生成打包报告原创 2020-04-07 11:56:54 · 504 阅读 · 0 评论 -
Vue项目npm打包推荐方式
npm install --registry=https://registry.npm.taobao.org npm cache clean --forcenpm instal原创 2020-04-07 11:13:56 · 574 阅读 · 0 评论 -
Element-UI中Cascader 级联选择器使用
Element-UI的级联组件官方文档 <el-cascader v-model="value" :options="options" :props="{ expandTrigger: 'hover' }" @change="handleChange"></el-cascader>说明:options:绑定数据源props:数据配...原创 2020-04-05 23:44:00 · 1390 阅读 · 0 评论 -
黑马商城项目级联选择占满全屏解决方案
在全局样式的css中添加一下面样式即可 .el-scrollbar__wrap { height: 300px !important}原创 2020-04-05 17:03:57 · 317 阅读 · 0 评论 -
vue商城
原创 2020-04-01 15:17:34 · 252 阅读 · 0 评论 -
vue-router的基本使用
原创 2020-03-31 22:48:11 · 234 阅读 · 0 评论 -
axios专栏
axios 基于promise用于浏览器和node.js的http客户端 支持浏览器和node.js 支持promise 能拦截请求和响应 自动转换JSON数据 能转换请求和响应数据 axios基础用法 get和 delete请求传递参数 通过传统的url 以 ? 的形式传递参数 restful 形式传递参数 通过params 形式传递参数 post 和 put 请求传递参数 通过 选...原创 2020-03-31 22:30:17 · 246 阅读 · 0 评论 -
Vue 快速集成ElementUI
App.vue作为Vue项目的主窗口<router-view></router-view>让路由生效main.js负责加载插件组件等views:放页面components:放组件router:路由配置:相当于springmvc的视图解析器将url和组件进行关联Element UI 后台管理系统主要标签说明el-container构建整个框架...原创 2020-03-28 23:51:27 · 332 阅读 · 0 评论 -
vue控制台报错Duplicate keys detected: 'xxxx'. This may cause an update error.解决方案
key值是必须唯一的,如果重复就会报错可以把key值改为index(其实就是用索引做key值),就可以避免这个情况添加一个索引key即可 <tr v-for="(item,index) in books" v-bind:key="index"> <td>{{item.id}}</td> &l...原创 2020-03-28 22:39:48 · 3517 阅读 · 0 评论