aminsky0-CSDN博客

原创 React-native开发环境搭建(Windows平台)

React-native开发环境搭建Windows平台

2022-11-01 13:52:20 1428

原创 react-native Animated简单动画制作

react-native Animated简单动画制作1、代码import React from "react";import { StyleSheet, View, Animated, Image } from "react-native";class LoopAnimate extends React.Component { constructor(props) { super(props); this.state = { spin

2022-05-13 11:40:22 1417

原创 js从数组中随机多次获取三个值，三个值不相同，上下相邻获取值也不相同

js从数组中随机多次获取三个值，上下相邻获取值不相同一、简单的数组排列let numArr = [1, 2, 3, 4]numArr.sort(function() { return 0.5 - Math.random();})二、从数组中随机多次获取三个值，上下相邻获取值不相同let oldCakeList = [];let arr = [];for (var i=0; i< taskList.length; i ++) { // 循环获取随机值数组arr thi

2022-05-13 11:19:09 2160

原创 RN文本阴影添加

RN文本阴影添加1、import { View, Text } from “react-native”; 引入文本2、内容<View style={styles.onceAndReback}> <Text style={styles.wordleftscss}>{'重新开始'}</Text></View>3、样式var styles = StyleSheet.create({ wordscss: { fontSize:

2022-05-13 10:07:34 323

原创 RN canvas绘制图片阴影

canvas绘制图片阴影效果引入react-native-canvasimport Canvas, { Image as CanvasImage } from “react-native-canvas”;数据data.js{ buseUrl: imgurl width: 206, height: 72, shadowColor: 'rgba(216, 165, 84, 0.29)', shadowOffsetY: 1

2022-04-17 17:57:59 868 3

原创 RN获取屏幕高宽、自适应(rem)设置

RN获取屏幕高宽、自适应(rem)设置1、引入Dimensions2、通过Dimensions.get(“window”).width/height; 获取屏幕高宽pxToDp自适应js文件：import {Dimensions} from 'react-native';// 获取竖屏模式的宽度const deviceWidthDp = Dimensions.get('window').width;// UI 默认给图是750const uiWidthPx = 750;//传入设计稿宽度

2022-04-01 13:02:42 2295

原创 React-Native时间进度条

React-Native时间进度条import React, {Component} from "react";import { StyleSheet, View, Text } from "react-native";import DataStore from "../DataStore";let timer // 全局定时器class TimeProgressLine extends React.Component { constructor(props) { sup

2022-03-08 13:35:46 1464

原创百度智能云服务器安装nginx环境

百度智能云服务器安装nginx环境1、将系统换成centos-72、添加Nginx到YUM源sudo rpm -Uvh http://nginx.org/packages/centos/7/noarch/RPMS/nginx-release-centos-7-0.el7.ngx.noarch.rpm3、安装Nginxsudo yum install -y nginx yum install nginx4、查看是否安装成功rpm -qa | grep nginx5、启动nginxsyste

2021-10-18 16:33:05 3361

原创 vue实现星级评分

1、vue实现星级评分实现效果实现代码<template> <div> <ul class="ulcss"> <li v-for="(item, index) in starList" :key="index"> <img v-if="item.isShowStar" src="../assets/star.svg" alt=""> <img

2021-10-15 17:34:17 2433 2

原创 url访问公司内部项目登陆出现网络异常

url访问公司内部项目登陆出现网络异常今天遇到个奇葩问题，访问公司内部的平台地址，接口一直没有返回，查了很久原因，都说是跨域引起的，后来尝试不同方法找到两个解决方案####### 方案一将访问地址中的https改成http####### 方案二将浏览器恢复出厂设置...

2021-09-23 10:44:37 183

原创 vue3+ts+antd环境搭建

vue3+ts+antd环境搭建1、vue create video-clip 脚手架创建项目2、3、4、58、删除无关文件9、引入antdnpm i --save [email protected]中引入antdimport { createApp } from 'vue'import App from './App.vue'import Antd from 'ant-design-vue';import 'ant-design-vue/dist/antd.c

2021-07-27 17:27:06 877

原创 vue3引入antd

vue3引入antd1、安装依赖npm install ant-design-vue --save2、main.js中全局引入并注册import Antd from ‘ant-design-vue’import ‘ant-design-vue/dist/antd.css’Vue.use(Antd)

2021-07-27 09:59:26 1571

原创 vue实现马赛克功能

vue实现马赛克功能今天小猪实现了一个有趣的马赛克功能，感兴趣的可以看看。。。。一、安装image-mosaicnpm install image-mosaic小猪也就不墨迹了直接上代码二、实现马赛克代码<template> <div id="box"> <canvas id="canvas"></canvas> <button id='drawAll'>一键加码</button>

2021-07-14 16:36:50 1974

原创 linux环境安装nginx

linux环境安装nginx今天又学到新姿势了～～～～～～～～～～～～小主今天搭建了自己的服务器，服务器有自己的ip，但是小主一开始不知道怎么才能访问到对应的ip服务器执行如下命令进行yum安装nginxyum install nginx查看nginx版本nginx -v查看参数nginx -V...

2021-06-25 09:35:55 54

原创 vue confirm添加换行

vue confirm添加换行const h = this.$createElementthis.$confirm('提示', { message: h('div',[ h('p','是否确认复制当前检测产品?'), h('p', row.name) ]), confirmButtonText: '确定', cancelButtonText: '取消', type: 'warning'}).then(() => { this.ge

2021-06-23 09:50:00 1797

原创 JSON.stringify()无法转化ES6中map数据问题

JSON.stringify()无法转化ES6中map数据问题今天在开发中遇到了一个奇怪的问题，小编要记录一下。。。今天小编开发中看到项目以前用 JSON.stringify(this.defectBaseData3)===”{}“为空对象的判断，结果小编调试的时候发现this.defectBaseData数组超大的时候*JSON.stringify(this.defectBaseData3)===”{}“*也为true，弄的小编怀疑人生，下面黏贴上代码 if (JSON.stringify(thi

2021-06-04 18:54:22 1702

原创 js时间戳日期格式化带星期方法

js时间戳日期格式化方法handleTimeForm(time) { let date = new Date(time); let y = 1900 + date.getYear(); let m = "0" + (date.getMonth() + 1); let d = "0" + date.getDate(); let h = "0" + date.getHours(); let mm = "0" + date.getMinut

2021-05-10 15:59:49 819 1

原创深度选择器deep使用总结

深度选择器deep使用总结1、深度选择器有三种写法/deep/、>>>、::v-deep2、vue3使用 ::v-deep3、vue2使用 /deep/、>>>

2021-05-08 17:41:27 854

原创 vue中有哪些修饰符和事件修饰符

vue中有哪些修饰符和事件装饰符1、常见修饰符有.sync，.lazy，.passive(1).sync因为vue是单向数据流，从父组件传到子组件的数据，子组件如果修改数据会报错，加上.sync后子组件内部改变props属性值并更新到父组件中(2).lazyv-model双向数据绑定，输入框输入内容时视图就更新了，如果想要输入完所有数据再更新视图，可以通过添加.lazy实现光标离开后再更新视图<input type="text" v-model.lazy="value">(3).

2021-04-27 15:19:45 1006

原创线程和进程的区别

线程和进程的区别进程是资源分配的最小单位，线程是CPU调度的最小单位做个简单的比喻：进程=火车，线程=车厢1、线程在进程下行进（单纯的车厢无法运行）2、一个进程可以包含多个线程（一辆火车可以有多个车厢）3、不同进程间数据很难共享（一辆火车上的乘客很难换到另外一辆火车，比如站点换乘）4、同一进程下不同线程间数据很易共享（A车厢换到B车厢很容易）5、进程要比线程消耗更多的计算机资源（采用多列火车相比多个车厢更耗资源）6、进程间不会相互影响，一个线程挂掉将导致整个进程挂掉（一列火车不会影响到另外一

2021-04-25 20:11:17 71

原创页面从输入url到渲染完成的全部过程

页面从输入url到渲染完成的全部过程1、DNS 域名解析2、HTTP 请求和TCP 连接3、请求返回html处理 HTML 标记并构建DOM 树，通过HTML解析器解析HTML文档，构建一个DOM Tree。处理CSS 标记并构建CSSOM 树，通过CSS解析器解析HTML中存在的CSS，构建Style Rules。将DOM与 CSSOM合并成一个渲染树（Render Tree）。根据渲染树来布局，Render Tree构建完毕，进入到布局阶段（layout/reflow），将会为每个阶段分配

2021-04-25 16:46:10 154

原创移动端video标签使用出现点击视频controls控件不展示

移动端video标签使用出现点击视频controls控件不展示这个问题一般是因为video移动端尺寸变化导致解决方法：可以在video标签外层加个div，添加一个点击事件，将controls赋值为true<div class="video-wrap" v-show="isVideoShow" @click="handlePlayClick()"> <video class="videocss" ref="videoCon" :src="videoUrl"></vi

2021-04-25 16:25:02 2844

原创 swiper移动端横向滑动问题处理

swiper移动端横向滑动问题处理一、swiper初始化问题数据加载的过程中使用v-if进行判断会导致一开始dom没有渲染，等数据加载完成才会渲染dom若是使用v-if会导致swiper初始化不成功new Swiper('.swiper-container', { mode: 'horizontal', freeMode : true, slidesPerView: 2, slidesPerGroup: 2, touchRatio: 1,

2021-04-25 15:57:01 1640

原创 webpack优化

webpcak优化在配置 Loader 时通过 include 去缩小命中范围介绍过在使用 Loader 时可以通过 test 、 include 、 exclude 三个配置项来命中 Loader 要应用规则的文件。为了尽可能少的让文件被 Loader 处理，可以通过 include 去命中只有哪些文件需要被处理。以采用 ES6 的项目为例，在配置 babel-loader 时，可以这样：module.exports = { module: { rules: [ {

2021-04-22 15:17:05 108

原创 vuex中mutation和action的区别

vuex中mutation和action的区别mutation 同步操作storeaction 异步操作mutation 然后修改store

2021-04-02 15:58:18 182

原创 react修改数组中某个参数值的方法

react修改数组中某个参数值的方法const currentPageVideoList=[...this.state.currentPageVideoList];this.setState({currentPageVideoList: currentPageVideoList.map((item, key)=> key==index?{...item, coverImg: this.state.defaultImg}:item)})...

2021-03-03 20:22:09 2175 2

原创闭包的特性及优缺点

闭包特性以及优缺点特性：1、函数套函数；2、内部函数可以直接使用外部函数的局部变量或参数；3、变量或参数不会被垃圾回收机制回收 GC；优点：1、变量长期保存在内存中；2、避免被全局变量污染；3、私有成员的存在；缺点：1、由于闭包中的变量长期存储在内存中，或造成内存消耗，会造成内存泄漏...

2020-12-06 19:20:54 565

原创 http状态码的梳理

一、1XX 信息性状态码100 收到了请求的起始部分，客户端应该继续请求101 服务器正根据客户端的指示将协议切换成Update Header列出的协议二、2XX 成功状态码200 服务器成功处理了请求（这个是我们见到最多的）201 对于那些要服务器创建对象的请求来说，资源已创建完毕。202 请求已接受，但服务器尚未处理203 服务器已将事务成功处理，只是实体Header包含的信息不是来自原始服务器，而是来自资源的副本。204 Response中包含一些Head

2020-11-26 16:39:38 58

原创原型链的理解

原型链原型链是实现继承的主要方法基本思路就是利用原型让一个引用类型继承另一个引用类型的属性和方法。每个构造函数都有一个原型对象，原型对象都包含一个指向构造函数想指针(constructor)，而实例对象都包含一个指向原型对象的内部指针(proto)。如果让原型对象等于另一个类型的实例，此时的原型对象将包含一个指向另一个原型的指针(proto)，另一个原型也包含着一个指向另一个构造函数的指针(constructor)。假如另一个原型又是另一个类型的实例，如此层层递进，这就构成了实例与原型的链条。这就是原

2020-11-25 15:15:27 167

转载 computed和watch的区别

computed是计算属性1、支持缓存，只有依赖数据发生改变，才会重新进行计算2、不支持异步操作，当computed内有异步操作时无效，无法监听数据的变化3、. computed 属性值会默认走缓存，计算属性是基于它们的响应式依赖进行缓存的，也就是基于data中声明过或者父组件传递的props中的数据通过计算得到的值4、如果一个属性是由其他属性计算而来的，这个属性依赖其他属性，是一个多对一或者一对一，一般用computed5、如果computed属性属性值是函数，那么默认会走get方法；函

2020-11-24 14:29:03 203

转载 v-if和v-show的区别

v-if是动态的向DOM树内添加或者删除DOM元素；v-show是通过设置DOM元素的display样式属性控制显隐；v-if切换有一个局部编译/卸载的过程，切换过程中合适地销毁和重建内部的事件监听和子组件；v-show只是简单的基于css切换；v-if是惰性的，如果初始条件为假，则什么也不做；只有在条件第一次变为真时才开始局部编译（编译被缓存？编译被缓存后，然后再切换的时候进行局部卸载); v-show是在任何条件下（首次条件是否为真）都被编译，然后被缓存，而且DOM元素保留；v-if有更高的切换消

2020-11-19 17:43:49 73

转载回流和重绘的区别

1、回流与重绘的定义当render tree中的一部分(或全部)因为元素的规模尺寸，布局，隐藏等改变而需要重新构建。这就称为回流(reflow)。每个页面至少需要一次回流，就是在页面第一次加载的时候。在回流的时候，浏览器会使渲染树中受到影响的部分失效，并重新构造这部分渲染树，完成回流后，浏览器会重新绘制受影响的部分到屏幕中，该过程成为重绘。2、如何减少回流、重绘减少回流、重绘其实就是需要减少对render tree的操作（合并多次多DOM和样式的修改），并减少对一些style信息的请求，尽量利用好浏览

2020-11-19 17:22:55 1763

空空如也

空空如也