Vue学习
文章平均质量分 51
不情不愿
这个作者很懒,什么都没留下…
展开
-
Vue 的响应式原理
数据发生改变,界面跟着更新,如图所示:<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0">原创 2022-05-18 16:42:46 · 876 阅读 · 0 评论 -
NGINX 部署 Vue 项目
1. windows 下载 nginx: 官网链接https://nginx.org/点击下载稳定版本 stable version双击运行即可,在浏览器输入 localhost 回车来到以下界面:说明服务器启动成功。将打包的 dist 文件夹中的文件放到 html 文件夹内。刷新浏览器 localhost 如下:能够正常访问!...原创 2022-05-17 16:48:12 · 639 阅读 · 0 评论 -
Vue 组件的高级封装模式
一、传统模式我们在使用 vue 进行项目开发过程中,对组件的封装是不可避免的,组件式开发在很大程度上提高了代码的复用性,能够提高开发效率。一般情况下,我们使用最基础的封装模式,基本流程如下:创建 Xxx.vue 文件,对组件进行封装 通过 import 的方式将组件导入 import Xxx from '...' 对组件进行注册 componments:{ Xxx } 使用组件:<xxx/>示例:封装一个 Toast 弹窗组件1.创建 Toast.vue 文件&l...原创 2022-05-17 12:22:40 · 1674 阅读 · 0 评论 -
项目开发的一些初始化工作
一、目录划分二、CSS 初始化新建 css 文件 normalize.css,GitHub 上搜索并下载下来:在 base.css 文件中引入 normalize.css 文件并配置一些基本样式,然后在 App.vue 文件中引入:@import "./assets/css/base.css";三、 配置文件夹别名在 vue.config.js 文件中添加以下代码:module.exports = { configureWebpack:{ resol.原创 2022-05-09 21:28:42 · 382 阅读 · 0 评论 -
Vue 项目的成功发布和部署
Vue 项目的发布原创 2022-05-08 22:54:35 · 6780 阅读 · 1 评论 -
Vue 前端解析 Excel 数据
Vue 通过 xlsx 解析Excel 表格数据!原创 2022-05-07 10:39:15 · 10409 阅读 · 2 评论 -
iconfont—阿里图标的使用
阿里图标库在项目开发过程中的应用!!!原创 2022-05-05 21:18:42 · 2752 阅读 · 0 评论 -
Vue 安装 Element Plus
Vue CLI 3 下使用 Element Plus ,解决 icon 图标不显示的问题,亲测有效!!!原创 2022-05-05 12:58:49 · 14107 阅读 · 1 评论 -
Axios —— 网络请求
安装框架:npm install axios --save基本使用:import Vue from 'vue'import App from './App'import router from './router'import axios from 'axios'Vue.config.productionTip = false/* eslint-disable no-new */new Vue({ el: '#app', router, render: h =&g原创 2022-05-03 17:41:48 · 771 阅读 · 0 评论 -
Vuex ——详细介绍
Vuex 是一个专门为 Vue.js 应用程序开发的状态管理模式,它采用集中式存储管理应用的所有组件状态,并以相应的规则保证状态以一种可预测的方式发生变化。可以理解为:将多个组件共享的变量全部存储在一个对象里面,然后将这个对象放在顶层的 Vue 实例中,让其他组件可以使用,它最大的特点是响应式。一般情况下,我们会在 Vuex 中存放一些需要在多个界面中进行共享的信息。比如用户的登录状态、用户名称、头像、地理位置信息、商品的收藏、购物车中的物品等,这些状态信息,我们可以放在统一的地方,对它进行保存和管理。原创 2022-05-02 23:10:20 · 42608 阅读 · 12 评论 -
Promise
Promise 是 ES6 中的一个特性,是异步编程的一种解决方案。基本语法处理方式一:new Promise((resolve,reject) => { //异步请求操作 setTimeout(() => { //成功时调用 resolve() resolve('Hello World')//执行 resolve() 函数后,会调用 Then() 函数 //失败时调用 reject(),一旦调用 reject(),就不会执行 resolve()原创 2022-05-01 21:14:38 · 182 阅读 · 0 评论 -
路由:Vue-Router
Vue-Router的详细介绍!!!原创 2022-04-28 20:19:21 · 1147 阅读 · 0 评论 -
Vue脚手架的使用(Vue CLI)
Vue CLI原创 2022-04-26 21:32:44 · 1771 阅读 · 0 评论 -
webpack配置文件的抽离
webpack.config.js文件的抽离原创 2022-04-26 11:53:44 · 1084 阅读 · 0 评论 -
搭建本地服务器(webpack-dev-server)
使用webpack搭建一个本地开发服务器原创 2022-04-26 10:25:19 · 1144 阅读 · 0 评论 -
Webpack之plugin
webpack中的插件原创 2022-04-25 21:06:11 · 2919 阅读 · 0 评论 -
Webpack中使用Vue的相关配置
webpack配置vue原创 2022-04-25 16:15:24 · 1058 阅读 · 2 评论 -
webpack之loader
webpack打包css文件、less样式文件、图片文件、ES6转ES5原创 2022-04-24 22:28:44 · 721 阅读 · 1 评论 -
Webpack的使用
1、webpack起步新建文件夹目录:src文件夹:存放开发内容/源代码。dist文件夹(distribution:发布):存放打包后的代码文件,最后将该文件交由服务器发布即可。src目录下新建main.js和mathUtils.js文件:mathUtils.jsfunction add(num1,num2){ return num1 + num2}function mul(num1,num2){ return num1 * num2}//模块化开发方式:c原创 2022-04-24 12:41:05 · 356 阅读 · 0 评论 -
Webpack的介绍与安装
Webpack介绍: Webpackhttps://www.webpackjs.com/简单来说,Webpack是一个前端模块化打包工具。Webpack支持前端模块化方案:AMD、CMD、CommonJS、ES6等。能够将模块化打包成浏览器可以识别的JS代码,帮助我们处理模块间的依赖关系。在Webpack中,不仅仅是JavaScript文件,我们的CSS文件、图片、json文件等都被当做模块来管理使用。 Webpack安装: webpack的运行必须依赖node环境,n..原创 2022-04-24 11:33:18 · 298 阅读 · 0 评论 -
前端模块化
常见的模块化规范:CommonJS、AMD、CMD、ES6的Modules模块化的两个核心:导出和导入CommonJS的模块化:(需要底层进行解析:node.js)CommonJS的导出:module.exports = { } CommonJS的导入:let { test,flag,sum} = require('moduleA')ES6中的模块化:导出:export 导入:import解决办法:VSCode中下载Live Server插件安装。...原创 2022-04-23 19:40:18 · 255 阅读 · 0 评论 -
Vue中的插槽——slot
vue的插槽使用slot原创 2022-04-22 11:52:47 · 606 阅读 · 0 评论 -
Vue中父子组件的访问方式
父访问子:this.$children或this.$refs.ref 子访问父:this.$parent和this.$root示例一:<!-- 父组件 --><div id="app"> <h2>父组件</h2> <h2>{{message}}</h2> <button @click="btnClick">父组件按钮</button> <!-- <cpn :cmessage原创 2022-04-22 09:58:51 · 418 阅读 · 0 评论 -
Vue案例:组件之间的传值问题
vue组件之间的传值与修改问题原创 2022-04-21 17:39:57 · 569 阅读 · 0 评论 -
Vue中父子组件之间传值
Vue组件传值原创 2022-04-20 17:53:48 · 605 阅读 · 0 评论 -
Vue的组件化
Vue组件原创 2022-04-19 16:47:28 · 308 阅读 · 0 评论 -
高阶函数filter、map、reduce的使用
filter/map/reduce的使用原创 2022-04-18 10:49:32 · 186 阅读 · 0 评论 -
Vue案例:购物车
vue案例原创 2022-04-15 22:34:03 · 762 阅读 · 0 评论 -
Vue案例一:动态绑定class的应用
vue动态绑定class属性原创 2022-04-15 11:56:59 · 121 阅读 · 0 评论 -
Vue中数组的响应式操作
数组的响应式操作原创 2022-04-15 11:10:36 · 3401 阅读 · 0 评论 -
v-show与v-if 的区别
v-if与v-show原创 2022-04-15 11:00:47 · 462 阅读 · 0 评论 -
Vue案例:v-if/v-else
v-if/v-else原创 2022-04-14 21:30:10 · 713 阅读 · 0 评论 -
vue中v-on:(@)事件监听
vue常用事件监听原创 2022-04-14 18:04:46 · 507 阅读 · 0 评论 -
Vue中计算属性(computed)与方法(methods)的对比
vue计算属性原创 2022-04-14 16:30:53 · 396 阅读 · 0 评论 -
Vue常用指令及动态绑定属性
vue常用指令、动态绑定属性原创 2022-04-13 21:58:44 · 907 阅读 · 0 评论 -
Vue入门体验
Vue学习笔记原创 2022-04-13 11:27:58 · 463 阅读 · 0 评论