
Vue2
简述Vue中的常用知识点
Software攻城狮
从 "前端" 向 "大前端" 方向进发 ————
(成功人士习惯去做失败者不爱做的事。他们当然也不喜欢干这些事,但他们让这种不喜欢服从于对自己目标的追求 。。。。。。 远离舒适,不断学习,知识更新,提升竞争力)
展开
专栏收录文章
- 默认排序
- 最新发布
- 最早发布
- 最多阅读
- 最少阅读
-
登录鉴权,axios封装
axios封装原创 2023-06-20 11:27:10 · 229 阅读 · 0 评论 -
列表中加,减,上下移操作列
列表的增减等操作原创 2022-07-10 08:47:15 · 136 阅读 · 0 评论 -
vue路由懒加载
vue路由懒加载原创 2022-05-30 14:15:00 · 117 阅读 · 0 评论 -
vue.config.js配置
vue.config.js配置原创 2022-05-30 08:36:26 · 103 阅读 · 0 评论 -
如何判断表单中值是否有变化
如何判断表单中值是否有变化若要使修改前后的表单值不同,需对其进行深拷贝原创 2022-01-27 11:05:54 · 1035 阅读 · 0 评论 -
Vue动态生成列表表头(ant-design)
Vue动态生成列表表头(ant-design)原创 2022-01-27 11:04:44 · 1009 阅读 · 0 评论 -
vue中的MVVM模式
vue中的MVVM模式<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <原创 2021-12-12 23:49:29 · 141 阅读 · 0 评论 -
Vue的相关认识
Vue的相关认识Vue中MVVM模型的理解:如图:Object.defineProperty 方法的理解<script> let number = 18 let person = { name :"张三", sex:"男", // age:18 } //@param 对象名,属性名,配置项 Object.definePropert原创 2021-12-06 10:18:28 · 291 阅读 · 0 评论 -
vue列表循环时,给每个元素加标识符
vue列表循环时,给每个元素加标识符可通过给变量设置... `name${index}`原创 2021-11-08 10:16:57 · 546 阅读 · 0 评论 -
vue自定义指令的添加
vue自定义指令的添加<template> <div v-cloak v-clickoutside="outsideClose" class="dropmain"> <div @click="show = !show" class="drop"> 测试下拉菜单 </div> <div class="dropdown" v-show="show"> <P>点击下拉菜单内容,点击外部区域原创 2021-11-06 11:25:11 · 311 阅读 · 0 评论 -
vue项目中使用pdfjs-dist预览pdf文件+分页并兼容字体
vue项目中使用pdfjs-dist预览pdf文件+分页并兼容字体1.安装npm install pdfjs-dist --save2.引入let PDFJS = require(“pdfjs-dist”);PDFJS.GlobalWorkerOptions.workerSrc = require(“pdfjs-dist/build/pdf.worker.min”);3<div class="center"> <div class="contor">转载 2021-10-18 22:14:08 · 5546 阅读 · 0 评论 -
vue动画 vue-lottie
vue动画 vue-lottietim-js-sdkcos-js-sdk-v5原创 2021-10-13 22:02:50 · 98 阅读 · 0 评论 -
vue使用 vant-ui 中的上拉加载的实现
vue使用 vant-ui 中的上拉加载的实现<div> <input/> <table><table/><div>...<van-list v-model="loading" :finished="finished" finished-text="没有更多了" @load="onLoad"><van-pull-refresh v-model="isLoading" @refresh="onRefr原创 2021-09-26 14:23:26 · 412 阅读 · 0 评论 -
vue中watch的使用
vue中watch的使用在vue中,使用watch来响应数据的变化。watch的用法大致有三种。下面代码是watch的一种简单的用法://template<input type="text" v-model="cityName"/>//jsnew Vue({ el: '#root', data: { cityName: 'shanghai' }, watch: { cityName(newName, oldName) { // ...转载 2021-08-09 14:35:25 · 158 阅读 · 0 评论 -
vue中动态获取元素的高度
vue中动态获取元素的高度原创 2021-08-07 16:46:03 · 826 阅读 · 0 评论 -
promise.all的使用
promise.all的使用在某些页面需同时调用多个后端接口,会存在异步问题,这时需要通过promise.all来处理,当然需要保证接口返回没有报错,即使接口异常,也不用返回报错,可提升系统异常等原创 2021-07-29 08:44:02 · 139 阅读 · 0 评论 -
vue中处理在keep-alive缓存情况下,页面的刷新
vue中处理在keep-live缓存情况下,页面的刷新可以监听路由:如何设置缓存,可参考:https://blog.csdn.net/weixin_41164499/article/details/90718155原创 2021-06-17 23:15:53 · 724 阅读 · 1 评论 -
vue在线编译网址
vue在线编译网址vue2.x版本在线编译:https://template-explorer.vuejs.org/#vue3.xx版本在线编译:https://vue-next-template-explorer.netlify.app/#例:原创 2021-05-09 22:29:14 · 1613 阅读 · 0 评论 -
vue3.0变更点
vue3.0变更点1.v-model//2.0<ChildComponent v-model="pageTitle" /><!-- 是以下的简写: --><ChildComponent :value="pageTitle" @input="pageTitle = $event" />//3.0<ChildComponent v-model="pageTitle" /><!-- 是以下的简写: --><ChildCo原创 2021-05-07 21:11:34 · 188 阅读 · 0 评论 -
vuex中modules的简单使用示例
vuex中modules的简单使用示例目录:index.jsimport Vue from 'vue'import Vuex from 'vuex'import account from './modules/account'import research from './modules/research'Vue.use(Vuex)export default new Vuex.Store({ modules:{ account, resear原创 2021-04-19 22:47:29 · 218 阅读 · 0 评论 -
vue之ant design组件库中的table表格的序号递增
vue之ant design组件库中的table表格的序号递增一、模板中自定义列二、在data中定义colum和分页原创 2021-03-29 22:45:33 · 1154 阅读 · 0 评论 -
vue插槽的理解
vue插槽的理解1、插槽内可以放置什么内容?2、默认插槽3、具名插槽4、作用域插槽一、插槽内容一句话:插槽内可以是任意内容。先看一下下面的代码:声明一个child-component组件,如果现在我想在内放置一些内容,结果会是怎样?<div id="app"> <child-component></child-component></div><script> Vue.component('child-comp转载 2021-01-10 21:18:44 · 188 阅读 · 1 评论 -
vue路由传参的三种基本方式
vue路由传参的三种基本方式父组件直接在路由中传参this.$router.push({ path: `/childList/${id}`, })需要对应路由配置如下:{ path: '/childList/:id', //name: 'childList', component: childList}子组件 获取参数:this.$route.params.id通过路由属性中的name来确定匹配的路由,通过params来传递参数 this.$router原创 2021-01-07 23:10:45 · 156 阅读 · 0 评论 -
vue自定义组件的使用及传值
vue自定义组件的使用及传值外部data的字段值赋值给自定义组件的属性,自定义组件通过本身或者内部触发事件,监听自定义组件事件更改data的字段值原理:vue里面自定义组件v-model 的使用:<custom v-model='GoodsList'></custom>等同于:<custom :value="GoodsList" @input="value => { GoodsList= value }"></custom>例:具体原创 2021-01-07 22:35:22 · 461 阅读 · 1 评论 -
Vue中更改表格中的某一行选项值的操作
Vue中更改表格中的某一行选项值的操作结合后端接口,进行相应的传参 Id, state值等,因相关组件库中的方法说明比较简单,有些需要自己去尝试,如下图中change()方法的传参等代码实现:组件库中的方法介绍:接口示例:效果:...原创 2021-01-04 06:51:39 · 3088 阅读 · 0 评论 -
Vue中登录过程的权限认证
Vue中登录过程的权限认证通过前端向后端发送请求, 后端返回token, 来进行相关相关权限的认证login() { // this.$refs.userForm 拿到了整个el-form,然后调用el-form的validate方法 this.$refs["userForm"].validate(valid => { if (valid) { // valid如果代表true代表该填写都填写了 // 正在登录中...原创 2021-01-03 09:48:56 · 721 阅读 · 0 评论 -
Vue中拦截器的使用(请求中加入token)
Vue中拦截器的使用一. 场景每一次的请求中都要加入token,判断是否登录,如果vue系统中,所有的请求都加入token,会比较麻烦,即提供了一种方法------拦截器二. 配置在config 中,加入 axios.js 文件import Vue from 'vue'// 在Vue的原型上挂在一个$axiosimport axios from 'axios'axios.defaults.baseURL = "http://127.0.0.1:8888/api/private/v1/" /原创 2020-12-27 19:46:43 · 1816 阅读 · 0 评论 -
Vuex使用的简单说明
Vuex使用的简单说明每一个 Vuex 应用的核心就是 store(仓库)。Vuex 使用单一状态树——用一个对象就包含了全部的应用层级状态。主要功能包括以下几点:State:存储状态Getter: 认为是 store 的计算属性 ,就像计算属性一样,getter 的返回值会根据它的依赖被缓存起来,且只有当它的依赖值发生了改变才会被重新计算。Mututation: 更改 Vuex 的 s...原创 2019-09-27 09:04:26 · 143 阅读 · 0 评论 -
Vue中的(远程)搜索功能
Vue中的(远程)搜索功能在vue的组件库(Element-ui, i-View等)中,有select 组件,内置有远程搜索功能,注意:方法中的 query 参数表示搜索框中的值,具体可以console.log打印出来,验证一下,然后根据前端传递后端所需的参数,即可请求到相关数据例:...原创 2019-08-26 23:14:20 · 1920 阅读 · 0 评论 -
vue中的批量下载(downloadFile)
vue中的批量下载(downloadFile)//mixin.jsexport default { method: { downloadFile(url) { try { let eleIF = document.createElement('iframe'); eleIF.src ...原创 2019-08-13 00:23:02 · 4639 阅读 · 0 评论 -
vue中的下载功能的实现
**vue elememt-ui中下载功能的实现 (window.loaction.href):**webpack路径配置中加上zuul, 表示延时deploy-desc(存放不同版本,迭代文件)文件中JSON文件的配置,加上路径3 HTML中:<a href="" @click.prevent=“downLoadTable(scope.row)”>下载......原创 2019-07-30 22:45:41 · 3992 阅读 · 0 评论 -
Vue中的动态组件(v-bind:is)的使用及组件传值
Vue中的动态组件(v-bind:is)的使用及组件传值在一个多标签的界面中使用 “ is ”特性来切换不同的组件:<component v-bind:is ="currentTabComponent"></component>有时候我们需要标签的组件实例能够被在它们第一次被创建的时候缓存下来。为了解决这个问题,我们可以用一个 元素将其动态组件包裹起来。...原创 2019-08-18 17:10:14 · 13665 阅读 · 2 评论