2021年03月_yinian_12

原创跨域原因和解决方法

1.跨域问题的由来何谓同源:URL由协议、域名、端口和路径组成，如果两个URL的协议、域名和端口相同，则表示它们同源。浏览器的同源策略，从一个域上加载的脚本不允许访问另外一个域的文档属性，是浏览器上为安全性考虑实施的非常重要的安全策略。举个例子：比如一个恶意网站的页面通过iframe嵌入了银行的登录页面（二者不同源），如果没有同源限制，恶意网页上的javascript脚本就可以在用户登录银行的时候获取用户名和密码。2.跨域的影响范围在浏览器中，script、img、iframe、link等标

2021-03-18 09:40:08 355

原创节流防抖

使用节流防抖函数(性能优化)那么在 vue 中怎么使用呢：在公共方法中（如 `untils.js` 中），加入函数防抖和节流方法// 防抖export function _debounce(fn, delay) { var delay = delay || 200; var timer; return function () { var th = this; var args = arguments; if (timer) {

2021-03-16 22:34:11 127

原创如何获取地址栏中的参数

第一种：字符串拆分法window.location.href 或者 location.href 或者 window.location 获得地址栏中的所有内容decodeURI() 可以解码地址栏中的数据恢复中文数据window.location.search 获得地址栏中问号及问号之后的数据//获取地址栏里（URL）传递的参数 function GetRequest(value) { //url例子：www.bicycle.com?id="123456"&Name="bicy

2021-03-16 19:45:37 739

原创富文本

安装插件npm install vue-quill-editor -smain.js引入 import VueQuillEditor from 'vue-quill-editor' import 'quill/dist/quill.core.css' import 'quill/dist/quill.snow.css' import 'quill/dist/quill.bubble.css' Vue.use(VueQuillEditor);组件中使用<template&g

2021-03-03 00:15:22 104

原创 vue动画效果

app.vue第一步<transition :name="transitionName"> <keep-alive :include="home"> <router-view /> </keep-alive> </transition>tip:在`app.vue`中，使用`transition`把`router-view`包裹起来第二步 data() { return {

2021-03-03 00:07:50 98

原创移动端px转换rem

一下载插件npm i postcss-pxtorem -Snpm i amfe-flexible -S二. 在vue.config.js对css进行设置const autoprefixer = require('autoprefixer');const pxtorem = require('postcss-pxtorem');module.exports = { css:{ sourceMap:false, loaderOptions: {

2021-03-02 23:48:44 132

原创缓存组件keep-alive

前言:被包含在keep-alive中的组件会多出两个生命周期函数：activated: 在keep-alive组件激活时调用，进入被keep-alive包裹的组件时触发deactivated:在keep-alive组件离开时都调用使用方法:直接包裹要缓存的组件,或者在app.vue中包裹所有组件 <keep-alive :include="home"> <router-view /> </keep-alive>通过判断路.

2021-03-02 23:40:38 2186

原创 vue3rem适配

安装插件 npm i postcss-pxtorem lib-flexible -D新建一个js文件postcss.config.jsmodule.exports = { plugins: { 'autoprefixer': { browsers: ['Android >= 4.0', 'iOS >= 8'] }, 'postcss-pxtorem': { rootValue: 37.5, pr

2021-03-02 16:40:15 256

原创安装vue3脚手架及使用

安装脚手架第一步打开小黑框，输入cnpm i -g @vue/cli第二步查看版本 vue -V第三步创见项目 vue create 项目名称手动配置Manually select features 选择手动配置有版本选择 vue3.x (Preview)使用待更新…...

2021-03-01 16:04:22 133

weixin_47648850的博客