fengshaopu的博客

分为几部分：第一：下载sortablejs插件第二在文件内部导入sortablejs插件第三进行配置使用第四效果图展示第一：下载sortablejs插件 npm： npm install sortablejs --save yarn： yarninstall sortablejs --save cnpm： cnpm install sortablejs --save 第二在文件内部导入sortablejs插件import Sortablejs from ‘sortable

导出1. 先下载插件 xlsx ， file-saver ， script-loader2.src目录下创建 Blob ，Export2Excel js文件npm installxlsx npm installfile-saver npm isntall script-loader3.在main.js导入importBlobfrom'./Excel/Blob'importExport2Excelfrom'./Excel/...

https://www.jb51.net/article/230746.htm

vue中实现验证码_~疆的博客-CSDN博客_vue验证码

var validatestatus = (rule, value, callback) => { //身份证校验 if (value === "") { // callback(new Error("请输入身份证")); } else { if (!/(^\d{15}$)|(^\d{17}(\d|X|x)$)/.test(value)) { callback(new Error("你输入的身份证长度或格式...

很简单就一行：headers:{"Content-Type":"application/json"} headers: { "Content-Type": "application/json" }

在vue2中可以直接使用 /deep/来穿透样式在vue3里面可以用过 :deep 来穿透样式

可以用element-ui的上传器 <el-upload action="http://testwcmd.sinoing.net/Upload/uploadChargeFace" name="userImage" :before-upload="beforeUploadFile" :on-success="handleSuccess" :on-cha

VUE2 前端实现 静态二级省市联动选择select的示例 - web开发 - 亿速云

JavaScript 自定义年月日选择下拉框select选择的日期方法vue实现_S筱潇S四维Smile-CSDN博客

1.安装插件vue-seamless-scrollnpm install vue-seamless-scroll --save　　2.导入插件<vue-seamless-scroll></vue-seamless-scroll> import vueSeamlessScroll from 'vue-seamless-scroll' components: { vueSeamlessScroll},　3.配置参数// 监听属性...

1.使用方法用命令行下载插件vue-particlesnpm install vue-particles --save-dev2、在main.js文件中全局引入import Vue from 'vue'import VueParticles from 'vue-particles'Vue.use(VueParticles)3、在需要使用粒子背景的组件中使用(一般是首-页或者登陆背景中使用)<template> <div id="login"&gt.

getBase64(imgUrl, callback) { // 一定要设置为let，不然图片不显示 const image = new Image(); // 解决跨域问题 image.setAttribute("crossOrigin", "anonymous"); const imageUrl = imgUrl; image.src = imageUrl; // image.onload为异步加载 .

正常用的都是elemelnt-ui组件的form表单；里面有校验规则；如下：<el-form :model="ruleForm" :rules="rules" ref="ruleForm" label-width="100px" class="demo-ruleForm"> <el-form-item label="活动名称" prop="name"> <el-input v-model="ruleForm.name"></el-input&g

对象用for of 数组用for infor in 如果想要循环对象的话要用 object.keys<div class="aa" v-for="(item, key) of cities" :key="key" :ref="key" v-show="show == false" > <div class="dd"> <span class="z">{{ key }}&l

目录：1.概念2.原理3.生命周期函数4.全局缓存5.组件缓存1.概念是vue提供给我们的一个组件用来切换路由的时候保存我们失活组件的状态比如我们从这个页面跳到了另一个页面返回来的时候还会在原来的位置2 原理    在 created 函数调用时将需要缓存的 VNode 节点保存在 this.cache 中／在 render（页面渲染） 时，如果 VNode 的 name 符合缓存条件（可以用 include 以及 exclude 控制），则会从 this.cache 中取出之前缓存

一、 vue-router 两种路由模式使用流程：创建一个对象，通过 path 和 component 属性配置 URL 路径和组件的对应关系。通过这个配置创建路由：new VueRouter({routes})页面中添加 router-view 组件显示匹配到的组件页面中使用 router-link 组件制作路由跳转的按钮在JS中可以使用 this.$router.push 方法实现路由页面的跳转Hash — 默认值，利用 URL 中的hash("#") 、history-- 利用UR

一、概念1.vuex是状态管理工具、主要实现组件通信中的数据共享2.在项目比较庞大的时候使用vuex二、几部分组成1.state 数据存储2.metations 可以直接操作state中的数据3.actions 异步调用、可以通过dispatch调用metations的方法可以直接修改state中的数据4.gettrers 类似于计算属性、可以做一些逻辑性的操作5.module 将分模块化存储三、map高级语法1.语法糖，四大金刚辅助函数：mapState,mapActions,mapM

一、八个钩子函数1.beforecreate 创建前2.created创建后3.beforemount 挂载前4.mounted 挂载后5.beforeupdata 更新前6.updataed更新后7.befordestory 销毁前8.destroy销毁后1.beforecreate 创建前使用这个钩子函数的时候只存在一些自己本身的实例，和生命周期函数，用户自定义不能使用2.created创建后是最早开始使用data、methods中的数据的3.beforemount 挂载前指

一、组件传值有1.父传子2.字传父3.兄弟1.父传子1）在父组件的子组件标签上绑定一个属性，挂载要传输的变量（2）在子组件中通过props来接受数据，props可以是数组也可以是对象，接受的数据可以直接使用 props:[“属性名”] props:{属性名:数据类型}2.字传父（1）在父组件的子组件标签上自定义一个事件，然后调用需要的方法（2）在子组件的方法中通过 this.$emit(“事件”)来触发在父组件中定义的事件，数据是以参数的形式进行传递的3.兄弟（1）在src中新建一个

第一步、找到当前文件夹，输入cmd 打开命令行输入 cnpm install axios --save 下载 axioscnpm install axios --save第二部下载完以后，在全局的main.js中配置import axios from 'axios'Vue.prototype.$axios=axios然后在组件中就可以使用了 mounted() { this.axios.get("https://api.it120.cc/small4/cms/news/list"

不废话先认识一个基本配置吧：一、创建项目使用 vue 得先有node、下载 cnpm install vue\cli -g -n命令是 npm create 文件名选择第二个 进入：选择router vuex babel选择N 二个N创建好以后是：1.node——modules 是依赖2.pubilc 可以存储json文件3.src里面的views是在页面上显示的3.App.vue 是全局的4.main.js 是可以配置文件的全局的5.router.js 路由6.store

使用 vue3 配置路由，步骤如下1、安装路由npm install vue-router@42、新建页面这里创建 view目录，然后在view目录下创建 A.vue B.vue 两个 vue页面文件A.vue内容<template> <div>A</div></template>B.vue内容<template> <div>B</div></template>

目录：1.添加进度条2.根据报错修改代码 这个是要有eslint3…执行build4.修改webpack的默认配置5.加载外部CDN6…定制首页内容7.路由懒加载8.项目上线一、添加进度条先下载 nprogress 然后放到封装的axios中 当axios请求数据的时候有进度条，当拦截的时候关闭进度条import NProgress from 'nprogress'//3. 请求拦截器配置Server.interceptors.request.use( (conf

我们要使用echarts先要去下载echarts官方文档：[](Documentation - Apache ECharts)

一、双向绑定原理双向绑定的话用到了vue的技术栈双向绑定在vue很常见，基本上没个页面都可以用到vue.js是采用数据劫持结合发布者-订阅者模式的方式，通过Object.defineProperty()来劫持各个属性的setter，getter，在数据变动时发布消息给订阅者，触发相应的监听回调来渲染视图。具体步骤：第一步： 需要observer的数据对象进行递归遍历，包括子属性对象的属性，都加上 setter和getter这样的话，给这个对象的某个值赋值，就会触发setter，

如果我们要去修改这个的距离左边的宽度的话第一种：不使用sass，sess就右键找到位置所在,然后找到对应的样式去编辑器里面修改，这样的话 是实现不了的，我们要把scoped去掉就好了2.使用 lass，less的话就可以用 穿透样式了 >>> 还有 /deep/ >>>.el-pagination__total { margin-right: 72px; font-weight: 400; color: #606

elemeng-ui 中el-form 表单如何校验：在el-form 上main可以用model，rules，model用于双向绑定，rules用于校验 <el-form :model="ruleForm" :rules="rules" ref="ruleForm" label-width="100px" class="demo-ruleForm" > </el-fo

一、安装步骤二、基本命令三、使用nginx访问到自己的目录一、安装步骤1、下载Nginx安装稳定版本的下载地址：http://nginx.org/en/download.html （Nginx官网）2、下载之后，解压到指定的目录，就可以看到以下的目录然后输入cmd 打开命令窗口 输入 start nginx ，然后在浏览器页面输入localhost，出现如下界面则表示安装成功。默认监听80端口号。二、基本命令（1）start nginx 开启nginx服务（2

一、模块1.路由守卫分为:1.全局路由守卫2.组件内部守卫3.路由独享守卫全局路由守卫所有模板都可以守卫到to是去那个页面from是从那个页面来next是否进入这个页面/下一步router.beforeEach((to,from,next)=>{ console.log(to); console.log(from); console.log(next()); next()})//全局鉴权router.beforeEach((to, from, n

一、目录1.下载2.放到src目录下3.main导入4.使用1.下载去我的git上去下载utilshttps://gitee.com/fengshaopu2001/p7/tree/master/d/src2.放到src目录下下载完放到 vue的src下面3.main导入import axios from './utils/request.js'Vue.prototype.$axios = axios这里导入了还不能使用还得用命令行下载个插件npm install js

一、步骤1.创建文件夹，下面有二个js文件2.http导入axios、router、store、vant里面的 弹框3.设置基地址跟请求拦截器、响应拦截器4.在另一个js中导入配置请求方式导入5.使用1.创建文件夹，在src下面创建二个js文件2.http导入axios、router、store、vant里面的 弹框import axios from 'axios'import router from '../router'import store from '../store'im

一、按需引入1.下载插件第一步我们可以先打开vant的官网：vant然后下载vant 用命令行下载 ：根据所需去配置 ： 我配置的是vant2Vue 2 项目，安装 Vant 2：npm i vant -S#Vue 3 项目，安装 Vant 3：npm i vant@next -S下载好以后我们去vue里面的根目 package.json里面去看一下下载好了吗 "dependencies": { "axios": "^0.21.1", "core-js": "

我们可以直接使用一个插件解决问题npm install fastclick --save 解决点击事件的延迟300毫秒的问题先下载 用命令行下载npm install fastclick然后在main.js中配置//引入300毫秒解决的插件import FastClick from 'fastclick'FastClick.attach(document.body);...

一、我们可以看 https://cn.vuejs.org/v2/guide/transitions.html二、transition 有二种状态 进入离开 / 显示隐藏单元素/组件的过渡·条件渲染 (使用 v-if)·条件展示 (使用 v-show)·动态组件·组件根节点过渡的类名：在进入/离开的过渡中，会有 6 个 class 切换。v-enter：定义进入过渡的开始状态。v-enter-active：进入时v-enter-to：进入结束后v-leave：定义离开过渡的开始状态

一、打包前必须做的要在文件夹下的vue.config.js文件然后在里面用module.exports导出一个修改资源路径默认的是绝对路径 要的是相对路径module.exports = { publicPath: './' }打包的命令行是npm run build打包玩以后用内置的服务器我们要去下载一个插件：如果没有配置的话是这样的绝对路径配置了的话是这个样子的相对路径二、去除生产环境sourceMapmodule.exports={ publicPath: '

一、配置1.在package.json全局里面配置2.创建三个.env文件3.在src下面创建一个config文件夹然后下面三个四个js4.全局导入5.使用这些环境二、在package.json全局里面配置1.serve 是开发环境 --open 是运行的时候自动开出页面2.build 打包环境3.test 测试环境"scripts": { "serve": "vue-cli-service serve --open", "build": "vue-cli-se