![](https://img-blog.csdnimg.cn/a1a99b199a7e4690b180b6d76c0cf25c.png?x-oss-process=image/resize,m_fixed,h_224,w_224)
Vue.js
vue
gxhlh
智慧的获取,能力的提升,创造力的领悟,是基于长期的投资回报周期。
展开
-
在Vue3中编写JSX的两种方式
在Vue3中,可以直接使用`render`选项编写,也可以在`setup`中返回。原创 2022-11-28 21:25:24 · 910 阅读 · 0 评论 -
在Vue3 中使用 JSX 和 React 使用 JSX 有何区别
Vue3 也支持 JSX,那么是不是两者完全相同?使用体验有何不同?原创 2022-11-28 21:02:14 · 444 阅读 · 0 评论 -
Vue3+TSX开发模式下内置组件的替代方案
Vue3+TSX开发模式下模板中内置组件的 JSX/TSX 语法实现原创 2022-09-26 00:04:25 · 1688 阅读 · 0 评论 -
Vue3动态路由组件的JSX/TSX写法
Vue3 router-view带 keep-alive 的 jsx/tsx 写法原创 2022-09-25 23:23:00 · 1551 阅读 · 2 评论 -
Vue3 项目常用插件使用流程总结
Vue3 常用项目插件使用总结,Elementplus、Vue-router、Pinia、Axios、Echarts原创 2022-08-16 08:13:50 · 2272 阅读 · 0 评论 -
Vue3+Ts+Vite 项目搭建&项目说明
如题。原创 2022-07-26 20:21:23 · 2929 阅读 · 0 评论 -
Vue3 选项卡简易实现
选项卡简易实现(动态组件)转载 2022-07-08 08:26:10 · 1028 阅读 · 0 评论 -
Vue 中监听浏览器窗口关闭事件
Vue中监听浏览器窗口关闭事件,并在窗口关闭时进行操作杰哥他们让我整理一下浏览器窗口关闭事件这个需求的实现给你参考一下这三篇文章实现起来应该不难https://blog.csdn.net/qq_41547882/article/details/114304782https://www.jianshu.com/p/021beaeee526https://www.jianshu.com/p/93f011981a47onunload和onbeforeunload都是在页面刷新和关闭前的动作,但是onb原创 2022-03-17 19:44:41 · 6310 阅读 · 0 评论 -
element-ui table设置点击样式和悬浮样式
步骤:1、先开启element的高亮选项开启 highlight-current-row <el-table :data="page_datas" border stripe highlight-current-row # 开启element table 行高亮选项 style="width: 100%"> <el-table-column type="selection" width="55" align="center">&l原创 2021-11-24 22:43:41 · 3005 阅读 · 0 评论 -
element-ui 全部导入与按需导入
element-ui 有两种使用方法:一种是(默认)全部导入,还有就是根据自己需要按需导入。如何进行选择,这里提供一个简单方法:主要就是一句话, 如果用到的组件少, 要按需引入, 如果用到的组件很多,就全部引入, 因为按需引入全部的, 和全部引入效果一样一、全部导入全局导入 在mian.js中导入(在vue项目中):import Vue from 'vue';import ElementUI from 'element-ui'; // 导入 elementUIimport 'element-u原创 2020-05-18 20:44:55 · 11471 阅读 · 2 评论 -
package.json文件是个什么东东?
package.json文件一、node_modules文件夹的问题文件夹以及文件过多过碎,当我们将项目整体拷贝给别人的时候,,传输速度会很慢很慢.复杂的模块依赖关系需要被记录,确保模块的版本和当前保持一致,否则会导致当前项目运行报错二、package.json文件的作用项目描述文件,记录了当前项目信息,例如项目名称、版本、作者、github地址、当前项目依赖了哪些第三方模块等。使用np...原创 2020-01-23 23:18:22 · 2804 阅读 · 1 评论 -
CentOS7.6 Web项目搭建与测试
CentOS7.6 Web项目搭建与测试CentOS7.6安装Nodejs(Npm)第一步:软件下载安装进行安装目录:cd /opt/software (如果目录不存在,请先创建目录)下载二进制包:wget https://nodejs.org/dist/v10.15.1/node-v10.15.1-linux-x64.tar.xz (下载地址去官网查询最新的,wget命令如果不存在...原创 2019-12-23 09:37:35 · 1326 阅读 · 0 评论 -
Vue前端工程化--webpack中的加载器
webpack中的加载器通过loader打包非js模块:默认情况下,webpack只能打包js文件,如果想要打包非js文件,需要调用loader加载器才能打包loader加载器包含:less-loadersass-loaderurl-loader:打包处理css中与url路径有关的文件babel-loader:处理高级js语法的加载器postcss-loader.css-load...原创 2019-12-16 15:25:10 · 285 阅读 · 0 评论 -
Vue前端工程化--webpack简介及使用
webpack一、当前 Web 开发面临的困境文件依赖关系错综复杂静态资源请求效率低模块化支持不友好浏览器对高级 Javascript 特性兼容程度较低etc…二、webpack 概述webpack 是一个流行的前端项目构建工具(打包工具),可以解决当前 web 开发中所面临的困境。 webpack 提供了友好的模块化支持,以及代码压缩混淆、处理 js 兼容问题、性能优化等强大...原创 2019-12-13 09:19:30 · 338 阅读 · 0 评论 -
Vue前端工程化---模块化的相关规范
1.模块化的分类A.浏览器端的模块化AMD(Asynchronous Module Definition,异步模块定义)代表产品为:Require.jsCMD(Common Module Definition,通用模块定义)代表产品为:Sea.jsB.服务器端的模块化服务器端的模块化规范是使用CommonJS规范:使用require引入其他模块或者包使用export...原创 2019-12-12 10:10:48 · 964 阅读 · 0 评论 -
Vue实现后台管理案例
Vue实现后台管理案例(★★★)案例效果:点击左侧的"用户管理",“权限管理”,“商品管理”,“订单管理”,"系统设置"都会出现对应的组件并展示内容其中"用户管理"组件展示的效果如上图所示,在用户管理区域中的详情链接也是可以点击的,点击之后将会显示用户详情信息。案例思路:1. 先将素材文件夹中的11.基于vue-router的案例.html复制到我们自己的文件夹中。看一下这个文件中的...原创 2019-12-04 17:50:41 · 3008 阅读 · 1 评论 -
Vue路由(详细)
Vue路由(详细)1.路由的概念路由的本质就是一种对应关系,比如说我们在url地址中输入我们要访问的url地址之后,浏览器要去请求这个url地址对应的资源。那么url地址和真实的资源之间就有一种对应的关系,就是路由。路由分为前端路由和后端路由后端路由是由服务器端进行实现,并完成资源的分发前端路由是依靠hash值(锚链接)的变化进行实现后端路由性能相对前端路由来说较低,所以,我们接...原创 2019-12-04 16:45:05 · 626 阅读 · 0 评论 -
item.img中的路径并不会被 webpack 编译,还保持着相对路径的状态,最终产生 404 错误解决办法
vue.js+webpack 为 img src 赋值的路径问题?模板代码<template v-for="item in items"> <li v-show="item.show"> <a href="#"> <img v-bind:src="item.img"> </a> </li>...原创 2019-12-01 21:16:35 · 665 阅读 · 0 评论 -
vue项目中的v-for在Visual Studio Code提示错误的解决办法
最近在使用vue做项目的时候发现,VScode一直提示v-for错误,在网上找到了方法错误示例解决方法一:在for循环上添加 :key=‘index’key 的作用key来给每个节点做一个唯一标识key的作用主要是为了高效的更新虚拟DOM解决方法二:在左下角点击,在设置中修改拓展的Vetur插件,在json文件中添加"vetur.validation.template": ...原创 2019-11-30 22:46:27 · 1410 阅读 · 0 评论 -
Vue基础知识(四)
接口调用方式原生ajax基于jQuery的ajaxfetchaxios异步JavaScript的执行环境是「单线程」所谓单线程,是指JS引擎中负责解释和执行JavaScript代码的线程只有一个,也就是一次只能完成一项任务,这个任务执行完后才能执行下一个,它会「阻塞」其他任务。这个任务可称为主线程异步模式可以一起执行多个任务JS中常见的异步调用定时任何ajax事件函...原创 2019-11-25 23:48:51 · 365 阅读 · 0 评论 -
Vue基础知识(三)
Vue组件组件 (Component) 是 Vue.js 最强大的功能之一组件可以扩展 HTML 元素,封装可重用的代组件注册全局注册Vue.component(‘组件名称’, { }) 第1个参数是标签名称,第2个参数是一个选项对象全局组件注册后,任何vue实例都可以用组件基础用<div id="example"> <!-- 2、 组件使用 ...原创 2019-11-25 23:46:39 · 150 阅读 · 0 评论 -
Vue基础知识(二)
Vue常用特性表单基本操作获取单选框中的值通过v-model <!-- 1、 两个单选框需要同时通过v-model 双向绑定 一个值 2、 每一个单选框必须要有value属性 且value 值不能一样 3、 当某一个单选框选中的时候 v-model 会将当前的 value值 改变 data 中的 数据 gender 的值就是选中的值,...原创 2019-11-25 19:23:13 · 203 阅读 · 0 评论 -
Vue基础知识(一)
Vue 是什么?Vue (读音 /vjuː/,类似于 view) 是一套用于构建用户界面的渐进式框架vue 的核心库只关注视图层,不仅易于上手,还便于与第三方库或既有项目整合使用Vue将helloworld 渲染到页面上指令本质就是自定义属性Vue中指定都是以 v- 开头v-cloak防止页面加载时出现闪烁问题 <style type="text/css"&...原创 2019-11-25 13:26:53 · 364 阅读 · 0 评论 -
npm下bower 不是内部或外部命令也不是可运行程序(解决办法)
npm下bower 不是内部或外部命令也不是可运行程序(解决办法)弄了几个小时终于解决了bower安装好后,输入bower -v 不出现版本号却一直出错的情况。按照下面的参考文章配置好环境变量,就可以了。成功安装 vue 、jQueryWindows下安装npm、bower(配置环境变量)NodeJS、NPM安装配置步骤...原创 2019-11-18 19:36:14 · 2006 阅读 · 0 评论 -
对于Vue的一些认识
对于Vue的一些认识学习Vue和之前学习原生JavaScript有一个巨大的不同?就是以前我们可能是更多的是去直接操纵动DOM, 能够有温度的接触html css。然后在中间插入一段JavaScript代码。但是从MVVM框架开始中间会隔了一层。可能刚开开始会很不习惯。很多东西都只能用另外的一个方式去表达,但是当你去学会了之后,你习惯了它的这种表达方式之后。你把它理解了你就会发现其实这个才是最...原创 2019-11-13 10:23:23 · 446 阅读 · 0 评论 -
浅析前端开发中的 MVC/MVP/MVVM 模式
浅析前端开发中的 MVC/MVP/MVVM 模式MVC,MVP和MVVM都是常见的软件架构设计模式(Architectural Pattern),它通过分离关注点来改进代码的组织方式。不同于设计模式(Design Pattern),只是为了解决一类问题而总结出的抽象方法,一种架构模式往往使用了多种设计模式。要了解MVC、MVP和MVVM,就要知道它们的相同点和不同点。不同部分是C(Contr...转载 2019-11-10 20:35:14 · 278 阅读 · 0 评论 -
原来如此!一分钟了解什么是框架
框架是什么概念PHP框架,英文为Framework,关于其定义,这里给出了一些解释。这些定义各有千秋,可是太抽象,在我看来,框架就是指仅含基本结构的PHP网站。虽然这个定义不太严谨,但仍旧是足够准确的,非常直观清晰具体。泛泛而谈等于不谈,就这么说一个定义,理解起来还有些茫然。要说清它是什么,弄明白它是如何产生的就行了。接下来就模拟一次框架的诞生过程,就样我们就能理解框架到底是什么啦!...转载 2019-11-10 20:17:49 · 807 阅读 · 0 评论 -
新手向:Vue 的建议学习顺序(尤雨溪)(强烈建议看看)
如果你想学Vue但还不知道Vue应该怎么去学,或者学了一点但又非常迷茫不知道方向。或许本文能够给你一点小小的帮助!看看大佬的对于新手应该如何去快速入门Vue的一些相关回答。废话不多说。新手向:Vue 2.0 的建议学习顺序(尤雨溪)起步扎实的 JavaScript / HTML / CSS 基本功。这是前置条件。通读官方教程 (guide) 的基础篇。不要用任何构建工具,就只用最...转载 2019-11-05 17:10:30 · 8735 阅读 · 0 评论 -
Vue.js 样式绑定
Vue.js 样式绑定Vue.js classclass 与 style 是 HTML 元素的属性,用于设置元素的样式,我们可以用 v-bind 来设置样式属性。Vue.js v-bind 在处理 class 和 style 时, 专门增强了它。表达式的结果类型除了字符串之外,还可以是对象或数组。class 属性绑定我们可以为 v-bind:class 设置一个对象,从而动态的切换 cl...原创 2019-10-28 23:29:19 · 222 阅读 · 0 评论 -
Vue.js 监听属性
Vue.js 监听属性Vue.js 监听属性 watch,可以通过 watch 来响应数据的变化。以下实例通过使用 watch 实现计数器:实例<div id = "app"> <p style = "font-size:25px;">计数器: {{ counter }}</p> <button @click = "counter+...原创 2019-10-27 21:31:25 · 272 阅读 · 0 评论 -
Vue.js 计算属性
Vue.js 计算属性计算属性关键词: computed。计算属性在处理一些复杂逻辑时是很有用的。可以看下以下反转字符串的例子:实例 1<div id="app"> {{ message.split('').reverse().join('') }}</div><script>new Vue({ el: '#app', data: ...原创 2019-10-27 19:04:49 · 192 阅读 · 0 评论 -
Vue.js 循环语句
Vue.js 循环语句循环语句循环使用 v-for 指令。v-for 指令需要以 site in sites 形式的特殊语法, sites 是源数据数组并且 site 是数组元素迭代的别名。v-for 可以绑定数据到数组来渲染一个列表:v-for 指令<div id="app"> <ol> <li v-for="site in sites"&g...原创 2019-10-27 18:53:08 · 680 阅读 · 0 评论 -
Vue.js 条件语句
Vue.js 条件语句条件判断v-if条件判断使用 v-if 指令:v-if 指令在元素 和 template 中使用 v-if 指令:<div id="app"> <p v-if="seen">现在你看到我了</p> <template v-if="ok"><h1>JavaScript</h1><...原创 2019-10-27 18:45:01 · 303 阅读 · 0 评论 -
Vue.js 模板语法
Vue.js 模板语法Vue.js 使用了基于 HTML 的模版语法,允许开发者声明式地将 DOM 绑定至底层 Vue 实例的数据。Vue.js 的核心是一个允许你采用简洁的模板语法来声明式的将数据渲染进 DOM 的系统。结合响应系统,在应用状态改变时, Vue 能够智能地计算出重新渲染组件的最小代价并应用到 DOM 操作上。插值文本数据绑定最常见的形式就是使用 {{…}}(双大括号)...原创 2019-10-26 23:45:39 · 364 阅读 · 1 评论 -
Vue.js 起步
Vue.js 起步每个 Vue 应用都需要通过实例化 Vue 来实现。语法格式如下:var vm = new Vue({ // 选项})通过实例来看下 Vue 构造器中需要哪些内容:实例<div id="vue_det"> <h1>site : {{site}}</h1> <h1>url : {{url}}</h1&...原创 2019-10-26 23:28:57 · 230 阅读 · 0 评论 -
Vue.js 安装
Vue.js 安装1、独立版本可以在 Vue.js 的官网上直接下载 vue.min.js 并用 < script> 标签引入。下载 Vue.js2、使用 CDN 方法以下推荐国外比较稳定的两个 CDN,国内还没发现哪一家比较好,目前还是建议下载到本地。Staticfile CDN(国内) : https://cdn.staticfile.org/vue/2.2.2/vue...原创 2019-10-26 23:19:51 · 112 阅读 · 0 评论