![](https://img-blog.csdnimg.cn/20201014180756724.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
前端
文章平均质量分 80
风中蒲公英
心有猛虎
展开
-
uniapp引入小程序原生插件
怎么在uniapp中使用微信小程序原生插件,以收钱吧支付插件为例。原创 2023-09-14 11:50:51 · 2589 阅读 · 2 评论 -
nvue页面的text标签显示多行文本
uniapp中的nvue页面文本必须放在text标签里面,否则不能设置字体大小和颜色,且只能显示一行,如果想显示多行,则需要使用rich-text标签。text和rich-text如果需要显示省略号,可以使用lines和text-overflow属性。使用该class后还需要额外设置宽或者高或者使用flex=1才会生效。// nvue不支持直接传字符串。html-parser插件。原创 2022-09-30 17:55:15 · 1382 阅读 · 0 评论 -
前端直传阿里云OSS
前端直传阿里云OSS,支持h5,支持小程序,支持uniapp。阿里云对象存储服务(Object Storage Service,简称OSS),是阿里云对外提供的海量、安全、低成本、高可靠的云存储服务。原创 2022-08-29 16:59:00 · 13283 阅读 · 0 评论 -
koa2中使用jwt
随着技术的发展,分布式web应用的普及,通过session管理用户登录状态成本越来越高,因此慢慢发展成为token的方式做登录身份校验,然后通过token去取redis中的缓存的用户信息。随着之后jwt的出现,校验方式更加简单便捷化,无需通过redis缓存,而是直接根据token取出保存的用户信息,以及对token可用性校验,单点登录更为简单JSON Web Token由三部分组成,它们之间用圆点(.)连接,header.payload.signatureheader存token类型和签名算法payl原创 2022-02-10 17:17:54 · 1897 阅读 · 0 评论 -
koa2学习笔记
由 Express 原班人马打造的 koa,致力于成为一个更小、更健壮、更富有表现力的 Web 框架。使用 koa 编写 web 应用,通过async function,可以免除重复繁琐的回调函数嵌套,并极大地提升常用错误处理效率。安装npm install koa官网:https://koajs.com/Hello worldconst Koa = require('koa');const app = new Koa();// loggerapp.use(async (ctx, n.原创 2022-01-17 15:35:01 · 566 阅读 · 0 评论 -
nuxt中v-html指令警告(warning ‘v-html‘ directive can lead to XSS attack vue/no-v-html)
XSS是跨站脚本攻击(Cross-Site Scripting)的简称。通常指的是通过利用网页开发时留下的漏洞,通过巧妙的方法注入恶意指令代码到网页,使用户加载并执行攻击者恶意制造的网页程序。这些恶意网页程序通常是JavaScript。vue官网如下描述v-html在网站上动态渲染任意 HTML 是非常危险的,因为容易导致 [XSS 攻击]。只在可信内容上使用 v-html,永不用在用户提交的内容上。比如下面代码会在浏览器弹出2021<template> <section>原创 2021-08-04 20:55:27 · 3776 阅读 · 4 评论 -
sroll-snap-type制作全屏滚动
以前制作大屏上下滚动的网页时(一次滚动一屏),我们得借助js控制,或者使用第三方插件,比如fullpage.js或者swiper.js等,现在只需要两个css样式就可以完成这个效果。直接看代码,想看效果,直接复制下面的代码。<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> <style type="text/css">原创 2021-01-13 15:13:54 · 386 阅读 · 1 评论 -
swiper6无法显示分页
今天在nuxt项目中使用swiper,无法显示分页,而且在swiper-pagination类标签里面空空如也安装命令:npm install swiper vue-awesome-swiper --save# oryarn add swiper vue-awesome-swiper当时安装的版本如下:"swiper": "^6.4.1","vue-awesome-swiper": "^4.1.1"代码如下:<swiper ref="mySwiper" :options="sw原创 2020-12-11 17:34:09 · 1071 阅读 · 2 评论 -
nuxt项目中引用less/scss全局变量
项目中有些样式需要经常使用,并且未来有可能会改,比如主题色@theme-color,所以希望在一个地方定义后,后面直接引用变量即可。但是正常使用时,less的变量是不能跨文件使用的,下面使用@nuxtjs/style-resources来把变量注入到项目中的所有文件。1、安装less依赖npm install less less-loader --save2、安装style-resourcesnpm install @nuxtjs/style-resources --save如果是yarn如下原创 2020-12-10 16:59:17 · 3305 阅读 · 0 评论 -
可自定义样式的前端导入导出excel库xlsx
前端导入导出excel库xlsxSheetJS js-xlsx是一个纯前端操作excel的js库,API十分简洁方便安装$ npm install xlsx导入导入的时候需要定义一个模板,让用户按照模板填写excel,模板的第一行定义后台数据实体类的属性名,当数据读取成功后会是json格式[{name:’’,phoneNo:’’,description:’’},{}…]excel格式如下:namephoneNodescription张三13788888888备注原创 2020-06-02 17:00:46 · 2291 阅读 · 1 评论 -
first-child、first-of-type、nth-child和nth-of-type的区别
公共样式span,label{ display: inline-block; width: 80px; line-height: 30px; border: 1px solid #000000}1、first-child匹配第一个子元素匹配第一个span.test1 span:first-child{ background-color: #FFA500;}<div ...原创 2020-04-11 14:11:08 · 847 阅读 · 0 评论 -
跨页面通信postMessage和onmessage
简介通常,对于两个不同页面的,只有当它们位于同协议、同域名、同端口时,才可以通信。而window.postMessage() 方法可以安全地实现跨源通信。语法发送:otherWindow.postMessage(message, targetOrigin, [transfer]);otherWindow其他窗口的一个引用,比如iframe的contentWindow属性、执行wind...原创 2020-02-17 15:14:43 · 2578 阅读 · 0 评论 -
搭建和部署nuxt项目
说在前面的话vue.js开发的SPA是不利于seo的,搜索引擎对它支持的并不是太好,百度根本就不可以在SPA应用的页面抓取数据,这对很看重seo优化的网站来说肯定是不能容忍的。而使用nuxt开发的网站就可以让爬虫爬取,而且它是基于vue.js开发的服务端渲染应用框架,上手极快,大大的简化了SSR的开发难度。本机环境操作系统:centos7、Windows10nodejs:v13.0.1n...原创 2019-11-02 18:40:22 · 4837 阅读 · 1 评论 -
阿里犸良导出的json文件怎么使用
阿里犸良导出的json文件怎么使用犸良是什么犸良作为一站式动效制作平台,通过海量的动效素材以及可视化编辑能力,帮助零基础的用户轻松完成动效制作 ,支持全平台iOS,Android,H5,小程序。无论是营销展位、活动页面、空状态还是产品icon,让动效更简单。官网地址: https://design.alipay.com/emotionLottie 是什么Lottie 是 Airbnb 开源...原创 2019-10-21 13:17:34 · 1722 阅读 · 0 评论 -
vue组件传值的13种方式
vue组件传值不写这篇文章,我自己都不知道我知道的vue组件传值的方式竟然有13种之多,其实静下来想想,常用的也有五六种。1、父组件传给子组件在子组件里定义一个props,即props:[‘msg’],msg可以是对象也可以是基本数据类型如果你想定义一个默认值,即 props:{msg: {type: String, default: ‘hello world’}},需要注意的是这种传值是...原创 2019-10-19 19:09:27 · 56134 阅读 · 7 评论