weixin_51608296的博客

原创 ios使用video播放器，禁止自动全屏

ios系统怎么在微信中禁用video 全屏展示在video标签中 增加x5-video-player-type=“h5-page” x5-video-orientation=“landscape|portraitios系统怎么在浏览器中禁用video 全屏展示在video标签中 增加webkit-playsinline=“true” playsinline=“true” 百分百有效转载：苹果 ios 使用video 播放器，怎么禁止自动全屏_Big Cole的博客-CSDN博客_ios v

原创 判断android和ios

判断android和ios

原创 创建a标签并点击，防止反复添加

防止反复添加并移除a

原创 [pc移动端适配]Vue项目中自动将px转换为rem

一、配置与安装步骤：1、创建 rem.js文件：3、将以下代码复制到 rem.js 中：rem.js文件内容：适配移动端，前面代码不用rem.js文件内容：/** * 移动端适配的方法 */// import store from '@/store'//是否移动端// const isMobile = store.getters.isMobile// 设置 rem 函数function setRem() { // 当前页面宽度相对于 750 宽的缩放比例.

原创 window.open在苹果手机上失效的问题

var u = navigator.userAgent;var isAndroid = u.indexOf("Android") > -1 || u.indexOf("Adr") > -1; //android终端var isiOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/); //ios终端 if(isAndroid) { //android终端 let url = res...

原创 在vscode中的vue文件中配置vue3初始化快捷代码

1.点击设置——用户代码片段2.新建代码片段会生成一个xxx.code-snippets文件3.在文件里面输入以下代码{ "demo":{ "prefix":"v3", "body": [ "<template>", "\t", "</template>", "", "<script lang='ts'>", "import { defineComponent } from 'vue'",

转载 2021-10-27

Vue 拖拽组件 vuedraggable 和 vue-dragging一、描述 二、vuedraggable 三、Awe-dnd一、描述之前用 vue 写过一个在线的多二维码生成服务，体验地址：Online Multiple QRCode后面发现二维码多了之后有时候想要排序，需要将比较重要的放在上面或者第一个，因此拖拽排序的需求就出来了。知道 vue 肯定是有组件存在的，因此就直接搜了搜，找了两个不同的库分别是：vuedraggable awe-dnd两个库的里面不同，一

原创 图片生成二维码

图片<el-table-column label="头像" align="center"> <template slot-scope="{row}"> <img slot="reference" v-imageerror="require('@/assets/common/bigUserHeader.png')" :src=.

原创 配置腾讯云Cos

上边图的意思就是说，我们找一个可以免费上传图片的服务器，帮我们代管图片，我们在自己的数据库里只保存一个地址就行， 这其实也是很多项目的处理方案，会有一个公共的文件服务器第一步，我们必须先拥有一个腾迅云的开发者账号(小心腾讯云的广告电话)请按照腾讯云的注册方式，注册自己的账号第二步，实名认证选择个人账户...

原创 2021-06-03

/** * 将数据转换为树形结构 * 使用递归的方法 */export function tranListToTreeData(list, rootValue) { const treeArr = [] list.forEach(item => { if (item.pid === rootValue) { const children = tranListToTreeData(list, item.id) if (children.length &g.

原创 Cascader 级联选择器

<el-form ref="form" :model="formData" :rules="rules" label-width="120px"><el-form-item label="部门" prop="departmentName"> <!-- <el-input v-model="formData.departmentName" style="width:50%" placeholder="请选择部门" @focus="getDepartmen.

原创 functional：true提高性能

原创 一次性导入所有数据

原创 图片加载错误触发onerror事件

原创 sync修饰符

按照常规，想要让父组件更新showDialog的话，需要这样做// 子组件this.$emit('changedialog', false) //触发事件// 父组件<child @changedialog="method" :showDialog="showDialog" />method(value) { this.showDialog = value}只要用sync修饰，就可以省略父组件的监听和方法，直接将值赋值给showDialog// 点击确定时...

原创 webpack打包的时候不会解析@，所以要加上require方法

原创 响应拦截器

响应拦截器importaxiosfrom'axios'import{Message}from'element-ui'constservice=axios.create({baseURL:process.env.VUE_APP_BASE_API,timeout:5000})service.interceptors.request.use()//响应拦截器的use()方法相当于.then的使用，内部参数一个成功函数，一个失败函数service.i...

原创 vue2不支持响应式的情况

不支持响应式的情况：1、直接通过数组索引的方式赋值2、给对象添加新属性并赋值因为Vue在初始化时，会对已有的数据惊醒数据劫持处理（Object.defineProperty({get,set})),数组的变异方法，Vue在内部重写的，所以可以直接支持响应式解决：Vue.setthis.$set...

原创 用反向代理解决开发环境的跨域问题

解决开发环境的跨域问题为什么会出现跨域？当下,最流行的就是前后分离项目,也就是前端项目和后端接口并不在一个域名之下，那么前端项目访问后端接口必然存在跨域的行为.怎么解决这种跨域 ？请注意，我们所遇到的这种跨域是位于开发环境的，真正部署上线时的跨域是生产环境的开发环境的跨域开发环境的跨域，也就是在vue-cli脚手架环境下开发启动服务时，我们访问接口所遇到的跨域问题，vue-cli为我们在本地开启了一个服务,可以通过这个服务帮我们代理请求,解决跨域问题这就是vue-c.

原创 scss和sass的区别，scss的基本使用

sass和scss有什么关系？1、sass和scss其实是一样的css预处理语言，SCSS 是 Sass 3 引入新的语法，其后缀名是分别为 .sass和.scss两种。2、SASS版本3.0之前的后缀名为.sass，而版本3.0之后的后缀名.scss。3、两者是有不同的，继sass之后scss的编写规范基本和css一致，sass时代是有格的缩进规范并且没有‘{}’和‘；’。而scss则和css的规范是一致的。为了方便应用scss，我们可以在vscode中安装一个名为easy sass

原创 设置文章正文的样式 github-markdown包

关于文章正文的样式文章正文包括各种数据：段落、标题、列表、链接、图片、视频等资源。 将 github-markdown-css样式文件下载到项目中(https://github.com/sindresorhus/github-markdown-css) 导入 import './github-markdown.css' 添加类名markdown-body <div class="article-content markdown-body" v-h.

原创 在自定义组件上使用v-model

当我们传递给子组件的数据既要使用还要修改传递：props:isFollowed="articleInfo.is_followed"修改：自定义事件@update-is_followed="articleInfo.is_followed=$event"简写方式：在组件上使用v-model父组件：value="articleI...

原创 路径使用@就没有提示语法的解决办法

在项目根目录中添加一个jsconfig.json配置文件，内容如下：{ "compilerOptions": { "baseUrl": ".", "paths": { "@/*": ["src/*"] }, "target": "ES6", "module": "commonjs", "allowSyntheticDefaultImports": true }, "include": ["src/**/*"], "exclu

原创 获取后台资源参数的精度问题，返回404错误

为什么传的id是对的，请求后台数据却返回404的错误，因为id太长，后端返回的id为大数字，通过axios的JSON.parse自动转换后存在精度的问题。

原创 访问图片资源403问题

关于第三方图片资源403问题为什么文章列表数据中的好多图片资源请求失败返回 403？这是因为我们项目的接口数据是后端通过爬虫抓取的第三方平台内容，而第三方平台对图片资源做了防盗链保护处理。第三方平台怎么处理图片资源保护的？服务端一般使用 Referer 请求头识别访问来源，然后处理资源访问。Referer 是什么东西？扩展参考：http://www.ruanyifeng.com/blog/2019/06/http-referer.htmlReferer 是 HTTP 请

原创 时间格式化

1.处理相对时间推荐两个第三方库： Moment.js Day.js 两者都是专门用于处理时间的 JavaScript 库，功能差不多，因为 Day.js 的设计就是参考的 Moment.js。但是 Day.js 相比 Moment.js 的包体积要更小一些，因为它采用了插件化的处理方式。Day.js 是一个轻量的处理时间和日期的 JavaScript 库，和 Moment.js 的 API 设计保持完全一样，如果您曾经用过 Moment.js, 那么您已经知道如何使用 Day.