前端 终端 实战vue

uni-app vue2升级vue3过程中遇到的问题总结

首先是在升级的过程中,项目跑不起来,相关的问题不贴图了,解决办法简单粗暴,就是卸载,重装最新版Hbuilder X。可以解决一大部分问题。 再次,会出现如下报错: 是因为我在main.js中app.use 的问题,直接注释。然后发现还有如下问题: 排查了好久才发现,是因为写在app.vue中的检测小 ......
vue 过程 uni-app 问题 vue2

Vue项目使用Echarts来实现中国地图,省份显示

当时做的时候参考了CSND博主:接口写好了吗 第一步:下载echarts npm install echarts --save main.js中引入 import * as echarts from 'echarts'; 第二步:引入china.json文件 创建utils文件夹,在内创建china ......
中国地图 省份 Echarts 地图 项目

vue2项目搭建

1安装 脚手架和打包工具 创建项目 npm install -g vue-cli npm install -g webpack vue create 项目名 创建vue项目时报错:vue : 无法将“vue”项识别为 cmdlet、函数、脚本文件或可运行程序的名称。请检查名称的拼写,如果包括路径,请 ......
项目 vue2 vue

Vue2电商实战项目(二)

最新接口请求地址 - http://gmall-h5-api.atguigu.cn/ - 示例: http://gmall-h5-api.atguigu.cn/api/product/getBaseCategoryList axios二次封装 - 前端请求方法大概有这几种: XMLHttpReque ......
实战 项目 Vue2 Vue

vue属性之监听属性(watch)

简介 当一个变量的值发生变化时,执行对应的函数 语法 # 在属性中添加watch属性,并以需要监听变量的名字进行定义函数 data:{show: 'abc'} watch:{ show(){ 我是函数内容 } } 示例 <!DOCTYPE html> <html lang="en"> <head> ......
属性 watch vue

vue之计算属性(computed)

简介 在vue中,如果在methods中定义了一个函数,也是可以通过插值语法调用的,但会产生一个问题,如果有多个输入框使用了v-model,这时不管输入的内容是否与这个函数有关,这个函数都会执行一次,这样会让降低运行效率,为了解决这个问题,可以使用计算属性 计算属性效果: 计算属性只有在它的相关依赖 ......
computed 属性 vue

vue项目通过外部配置文件读取接口地址- 在webpack-index.html模板中使用环境变量

概述:在index.html模板中判断当前环境,处于开发环境下时读取process环境变量、处于生产环境下时读取根目录配置文件(./config.js),两种环境下将配置统一挂载到window全局变量上(SET_CONFIG) config.js window.SITE_CONFIG = { app ......
webpack-index 变量 接口 模板 webpack

testng+HttpClient项目实战(一)

参考文档: https://www.cnblogs.com/yingyingja/p/9973960.html https://www.cnblogs.com/yingyingja/p/9974181.html https://www.cnblogs.com/yingyingja/p/9974183 ......
HttpClient 实战 项目 testng

vue之组件

简介 组件(component)是vue.js最强大的功能之一。组件的作用就是封装可重用的代码,通常一个组件就是一个功能体,便于在多个地方都能够调用这个功能体。 每个组件都是Vue的实例对象。 我们实例化的Vue对象就是一个组件,而且是所有组件的根组件 在工程化工发后,一个组件就是一个 xxx.vu ......
组件 vue

前端代码安全与混淆

本文从攻击者角度和防御者角度详细解析前端代码安全与混淆的相关知识,总结了大部分攻击者共同点以及如何应对普通开发者外挂程序和Pyhton 爬虫 ......
前端 代码

跨域与解决跨域 (前端的处理)

一、什么叫跨域 ??? 跨域,是指浏览器不能执行其他网站的脚本。 它是由浏览器的同源策略造成的,是浏览器对JavaScript实施的安全限制。 浏览器的同源策略: 简单来说 同源 就是 指 协议、域名、端口号 均相同 二、解决跨域 1、CORS 下面是MDN对于CORS的定义: 跨域资源共享(COR ......
前端

vue 文件拖拽上传功能

现在,很多web端操作都喜欢使用拖拽上传功能。此方法使用起来也很简单,主要是使用 ondrop 和 ondragover 两个事件。 在vue中是这样的 <div class="upload-file-box" v-loading="loading" @drop="dropFile($event)" ......
功能 文件 vue

前端安装的插件

vscode中settings.json配置 { "prettier.configPath": "D:\\vscode\\Microsoft VS Code\\.prettierrc", // 安装Prettier配置 "eslint.alwaysShowStatus": true, "pretti ......
前端 插件

1.Vue的基本原理

当一个Vue实例创建时,Vue会遍历data中的属性,用Object.defineProperty(vue3.0使用proxy)将它们转为getter/setter,并且在内部追踪相关依赖,在属性被访问和修改时通知变化。每个组件实例都有相应的watcher程序实例,它会在组件渲染的过程中把属性记录为 ......
原理 Vue

Vue3快速上手

Vue3快速上手 1.Vue3简介 2020年9月18日,Vue.js发布3.0版本,代号:One Piece(海贼王) 耗时2年多、2600+次提交、30+个RFC、600+次PR、99位贡献者 github上的tags地址:https://github.com/vuejs/vue-next/re ......
Vue3 Vue

Vue 项目打断点

相关链接: https://www.jianshu.com/p/bedb5c2d6420 ......
项目 Vue

1.Vue的基本原理

当一个Vue实例创建时,Vue会遍历data中的属性,用 Object.defineProperty(vue3.0使用proxy)将它们转为 getter/setter,并且在内部追踪相关依赖,在属性被访问和修改时 通知变化。每个组件实例都有相应的watcher程序实例,它会在组 件渲染的过程中把属 ......
原理 Vue

3. Vue系列学习笔记 - Vue组件

定义Vue组件 什么是组件: 组件的出现,就是为了拆分Vue实例的代码量的,能够让我们以不同的组件,来划分不同的功能模块,将来我们需要什么样的功能,就可以去调用对应的组件即可;组件化和模块化的不同: 模块化: 是从代码逻辑的角度进行划分的;方便代码分层开发,保证每个功能模块的职能单一; 组件化: 是 ......
组件 Vue 笔记

6. Vue系列学习笔记 - 配置.vue组件

注意: 有时候使用npm i node-sass -D装不上,这时候,就必须使用 cnpm i node-sass -D 在普通页面中使用render函数渲染组件 在webpack中配置.vue组件页面的解析 运行cnpm i vue -S将vue安装为运行依赖; 运行cnpm i vue-load ......
组件 笔记 Vue vue

4. Vue系列学习笔记 - 路由

父组件向子组件传值 组件实例定义方式,注意:一定要使用props属性来定义父组件传递过来的数据 <script> // 创建 Vue 实例,得到 ViewModel var vm = new Vue({ el: '#app', data: { msg: '这是父组件中的消息' }, componen ......
路由 笔记 Vue

5. Vue系列学习笔记 - Webpack

在网页中会引用哪些常见的静态资源? JS .js .jsx .coffee .ts(TypeScript 类 C# 语言) CSS .css .less .sass .scss Images .jpg .png .gif .bmp .svg 字体文件(Fonts) .svg .ttf .eot .w ......
Webpack 笔记 Vue

7. Vue系列学习笔记 - 使用mui的tab-top-webview-main完成分类滑动栏

使用mui的tab-top-webview-main完成分类滑动栏 兼容问题 和 App.vue 中的 router-link 身上的类名 mui-tab-item 存在兼容性问题,导致tab栏失效,可以把mui-tab-item改名为mui-tab-item1,并复制相关的类样式,来解决这个问题; ......
tab-top-webview-main webview 笔记 main Vue

前端(一)

前端(一) 什么是前端 # 前端通俗来说就是和用户打交道的界面 eg: 网页就是前端 # 不跟用户直接打交道的就是后端,后端是真正实现具体功能的东西,也就是一堆看不见的代码 如: Java,Python,C,C++,C# 为什么学前端 # 只学Python,是后端开发工程师,学了前端变成全栈开发工程 ......
前端

(之前的项目复习)我的Java项目实战--校园餐饮商户外卖系统03

开发笔记三 分类管理业务开发 公共字段自动填充 问题分析 前面我们已经完成了后台系统的员工管理功能开发,在新增员工时需要设置创建时间、创建人、修改时间、修改人等字段,在编辑员工时需要设置修改时间和修改人等字段。这些字段属于公共字段,也就是很多表中都有这些字段,如下: 能不能对于这些公共字段在某个地方 ......
项目 商户 实战 餐饮 校园

学习笔记396—自定义Docker镜像推送到Docker Hub实战

自定义Docker镜像推送到Docker Hub实战 云原生探索的必经之路—容器化,而容器化目前最主流的技术莫过于Docker了,因为之前也大量的输出过Docker相关的技术博客,如果感兴趣的话可以直接访问专栏:​​《探索云原生》​​,按需学习哦。这篇文章还是从Docker入手,从0开始讲述下如何将 ......
Docker 实战 镜像 笔记 396

(一)初始vue

data属性 data属性是传入一个函数,并且该函数需要返回一个对象: 在Vue2的时候,也可以传入一个对象 在Vue3的时候,必须传入一个函数,否则报错 data中返回的对象会被vue的响应式系统劫持,之后对该对象的修改或者访问都会在劫持中被处理: 所有我们在template或者app通过{{co ......
vue

Vue动态创建组件实例并挂载到body

方式一 import Vue from 'vue' /** * @param Component 组件实例的选项对象 * @param props 组件实例中的prop */ export function create(Component, props) { const comp = new (V ......
组件 实例 动态 body Vue

一个 OpenTiny,Vue2 Vue3 都支持!

大家好,我是 Kagol,OpenTiny 开源社区运营,TinyVue 跨端、跨框架组件库核心贡献者,专注于前端组件库建设和开源社区运营。 今天给大家介绍如何同时在 Vue2 和 Vue3 项目中使用 TinyVue。 TinyVue 是一套跨端、跨框架的企业级 UI 组件库,支持 Vue 2 和 ......
Vue OpenTiny Vue2 Vue3

如何将微前端项目部署在同一台服务器同一个端口下

本文旨在通过部署微前端项目的实践过程中沉淀出一套部署方案,现就一些重点步骤、碰到的问题做了一些总结。 ......
前端 端口 服务器 项目

vue3使用elmentui-plus中的图标

按照官网这样直接引入使用,不知道为啥行不通: import { Document, Menu as IconMenu, Location, Setting, } from '@element-plus/icons-vue' 使用时,需要 <script> import { UserFilled } ......
elmentui-plus 图标 elmentui vue3 plus