小白变怪兽-优快云博客

原创利用css实现文本超出N行之后显示省略号等css常用小知识点

css代码如下：text-overflow: -o-ellipsis-lastline;overflow: hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 2; //这儿的数字代表的就是你所需要实现效果的第N行-webkit-box-orient: vertical;效果如下图所示...

2016-03-01 17:25:02 4832 1

原创 el-select下拉数据量太大，改成滚动加载数据

问题描述：当接口返回下拉数据量特别大的时候，页面会卡顿，下面采用下拉加载指定数据的方式来优化。

2024-07-29 09:38:22 388

原创关闭el-drawer内部数据没销毁

点击关闭之后，想再次进入el-drawer页面发现很卡，后来发现原来el-drawer在调用事件之后只是给el-drawer最外层加上了display: none;并没有销毁整个组件。el-drawer中渲染的数据量比较大，页面渲染有点慢。

2024-07-25 16:14:16 472

原创 uniApp vue2 vue3配置代理

【代码】uniApp vue2 vue3配置代理。

2024-06-28 16:20:01 763 1

原创 uni-app小知识点记录

【代码】uni-app小知识点记录。

2024-05-10 10:32:46 755

原创前端下载url文件(解决PDF, 图片自动在浏览器打开)

三、通用解决方案（这种主要是让浏览器识别到这个文件的type不是application/pdf，这样浏览器就不会自动在浏览器中打开该文件了）二、通过canvas下载图片。一、更改浏览器设置。

2024-04-09 16:14:11 715

原创 nginx部署VUE项目

目前公司的前端代码基本都是部署在nginx下，特此来记录一下开发环境：window10。

2023-04-19 11:43:12 1079

原创 Uncaught SyntaxError: Unexpected token ‘export‘

览器虽然支持了es6，但是不支持es6的Module直接使用，需要在script标签里加上 type=“module”，让浏览器很好的去认识它。index.html中引入一个下方这种结构的js文件，但是报错了。

2023-03-20 17:49:51 10558

原创 iframe(3) ---父页面与子页面互相传值

【代码】iframe(3) ---父页面与子页面互相传值。

2023-03-17 16:05:52 412

原创 wx.miniProgram.navigaTo不起作用

wx.miniProgram.navigato跳转失败

2022-10-28 10:20:12 2868

需求：点击左侧tree数据，得到右侧table数据，右侧复选框勾选后提交的数据展示在父组件上。在父组件重新进入弹窗的时候要默认展示勾选已经选中的项如下图所示：父组件展示内容点击选择日期展示弹窗重点：给复选框新增属性:reserve-selection=“true”，记录已勾选的值this.$refs[multipleTable].toggleRowSelection(item)勾选已选中项关键代码：<el-table-column align="center" type

2022-05-31 16:20:31 102

原创 vue小知识点记录

vue组件中引入图片（方法有很多，这里就记录自己常用的一种）background-image: url('~@/assets/XXX.png');

2022-03-01 11:44:04 512

原创 nginx小知识点记录

nginx代理命令location /tyt/ { rewrite ^/b/(.*)$ $1 break; proxy_pass https://tytdebug.hxcx.com.cn; }

2022-02-17 16:51:20 1341

原创 JS设计模式之 ------ 策略模式

策略模式

2022-01-17 09:37:34 998

原创 vue-admin-template只有一个子菜单时父级菜单不显示问题

如上图所示：加上 alwaysShow: true 即可

2022-01-11 16:50:13 1017

原创小程序怎么判断是在PC端打开的还是手机端打开的？

关于如何判断小程序是在哪个端打开的，主要有两种方式官方文档1.通过wx.getSystemInfo2.通过UA1.接下来我们主要记录下第一种方案onload() { wx.getSystemInfo({ success: (res) => { // window | mac为pc端 // android | ios为手机端 console.log('getSystemInfo,', res.platform); } });}...

2021-12-02 15:58:54 8902 2

原创 vue-cli3.0+中创建多个子项目，并能分别打包到对应的文件夹下

在日常开发中我们经常会碰到需要开发一些简单的功能页面，例如：618活动页面, 双十一活动页面等，这时候我们就希望在一套VUE脚手架下创建多个子项目了。官方文档说明执行以下步骤，新建一个项目目前使用脚手架搭建的项目默认都是单页面应用vue create hello-worldcd hello-worldnpm run serve那么我们要如何将vue项目改造成多页面应用，并且能够打包到对应文件夹下呢首先，我们先来调整项目的目录结构接下来找到vue.config.js.

2021-11-25 17:15:31 1697

原创判断是否在微信内置浏览器中打开网页

问题描述由于微信浏览器中无法打开外链，因此要想在微信内置浏览器中点击按钮下载是无法成功的，这时候我们就需要判断是否处于微信内置浏览器中，从而做出不同的提示。如下图所示：判断是否微信内置浏览器的代码const ua = window.navigator.userAgent.toLowerCase()let isWeixin = ua.indexOf('micromessenger') != -1; if(isWeixin) { // 微信内置浏览器内的操作 }else {

2021-11-25 10:06:50 1741

原创微信小程序上传图片移动端生效,PC端报错的问题

问题描述选择图片上传移动端小程序没问题,PC端的报错了功能描述如上图所示，需要实现从相册中选择图片上传实现代码：wx.chooseImage({ success(res) { // 此处得到的res结果如下，会得到图片的临时存储地址 // 当前使用开发者工具得到的res结果(手机上也一样)如图：结果1 // 使用pc端打开小程序得到的res结果如图：结果2 wx.uploadFile({ url: '***', filePath: res.tem

2021-11-24 09:38:53 2148

原创 flutter组件之间如何通信

一、子组件调用父组件方法说明：demo.dart为父组件, child.dart为子组件关键代码：// 父组件Child( callback: () { print('子组件触发了'); },)// 子组件onTap: () { widget.callback();}完整代码：// 父组件import 'package:flutter/material.dart';import 'package:tyt/view/demo/child.dart';/// 父

2021-10-28 17:31:52 2829

原创微信小程序自动滚动到最底部

微信小程序自动滚动到最底部实现方案应用场景：eg：聊天记录wxml:<scroll-view style="max-height: 100vh; background: pink;" scroll-y="true" scroll-into-view="{{scrollLast}}"> <view wx:for="{{dataList}}" id="lastPosition" style="border-bottom: 3rpx solid red; height: 100rpx;

2021-10-09 14:14:01 2719

原创 flutter零散知识点记录

1.页面跳转传递的参数如何接收Map<String, dynamic> argument = ModalRoute.of(context).settings.arguments as Map<String, dynamic>; int id; if (argument != null) { id = argument['id']; }/// 如果直接在InitState中获取会报错，处理方案如下Future.delayed(Duration.zero,

2021-09-08 16:52:06 559

原创 vuecli4配置公共scss样式文件

一、安装sass-resources-loadernpm install sass-resources-loader二、更改vue.config.js配置module.exports = { chainWebpack: config => { const oneOfsMap = config.module.rule('scss').oneOfs.store oneOfsMap.forEach(item => { item

2021-06-18 17:15:23 469

原创 js动态生成二维码

拷贝如下代码即可看到效果：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> &l

2021-06-18 16:43:28 400

原创关于移动端开发调试

一、 eruda用法：//在Html中引入<script src="//cdn.bootcss.com/eruda/1.2.4/eruda.min.js"></script><script> eruda.init();</script>效果，如下页面上就能看到如同Pc端上的控制台了二、 vConsole用法<script src="https://cdn.bootcdn.net/ajax/libs/vConsole/3.3

2021-06-18 14:08:14 143 1

原创 vue项目 --- RSA加密

1. 安装 jsencryptnpm install jsencrypt --save2. 在main

2021-06-14 22:28:48 188 2

原创 1.关于mustache

什么是mustache？mustache是一种模板渲染引擎mustache基本使用<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title>

2021-04-16 15:38:47 243

原创 Photshop投影与CSS中的box-shadow转换

（一）box-shadow语法box-shadow: h-shadow v-shadow blur spread color inset;值描述h-shadow必需。水平阴影的位置。允许负值。v-shadow必需。垂直阴影的位置。允许负值。blur可选。模糊距离spread可选。阴影的尺寸。color可选。阴影的颜色。inset可选。将外部阴影 (outset) 改为内部阴影。（二）实操“混合模式”：Photoshop提供了

2020-09-21 17:34:07 312

原创动态插入script

let script = document.createElement(“script”);script.type = “text/javascript”;if (typeof(callback) != “undefined”) {if (script.readyState) {script.onreadystatechange = function() {if (script.readyState == “loaded” || script.readyState == “complete”) {

2020-08-27 21:15:50 958

空空如也

空空如也