- 博客(15)
- 收藏
- 关注
原创 vue2.x slot插槽使用
vue2.x slot插槽使用三种类型匿名插槽具名插槽作用域插槽使用场景当遇到一个需求,子组件有上传文件的功能,在不同的父组件中,除了公共的上传功能之外,还有一些别的不同的dom样式,这个样式由父组件决定,这个时候就适合使用slot插槽;使用// 子组件<template> <div class="child"> <h3>这里是子组件</h3> // 匿名插槽,一个组件只能使用一个 <slot></
2020-12-29 12:34:20
303
原创 详细说明rem布局(px和vw实现的区别)
什么是rem布局简单来说,使用rem布局,在设置字体,宽高等大小时,是由html根元素的font-size决定的,并不一定是真实的font-size大小;px实现rem布局;例:当html的font-size为100px时,此时0.2rem == 20px;<style> html { font-size: 100px; } .p1 { font-size: .2rem; } .p2 { font
2020-11-10 19:52:23
337
原创 vue-cli2 favicon配置
vue-cli2 favicon配置将favicon.ico放在根目录下;build目录下// 在webpack.dev.conf增加new HtmlWebpackPlugin({ filename: 'index.html', template: 'index.html', inject: true, favicon: path.resolve('favicon.ico') // 增加这行}),// 在webpack.prod.conf增加new HtmlWebpack
2020-11-10 14:16:36
502
原创 vue audio标签引入本地音频无法播放的问题
无法播放:<audio src="../../audio/audio1.mp3" controls></audio>可以播放:<audio controls> <source src="../../audio/audio1.mp3" /></audio>
2020-09-04 11:08:30
6056
10
原创 vue 使用scss
vue 使用scss电脑node是12.18.2,使用的cli2创建的项目;安装node-sass sass-loader(sass-loader新版本10.x不支持,别的版本没试,我使用7.3.1是支持的)npm i node-sass sass-loader@7.3.1 -D修改文件配置,build -> webpack.base.conf.js,resolve下的extensions新加’.scss’resolve: { extensions: ['.js', '.v
2020-09-03 14:22:59
199
原创 vue cli2, cli3创建项目
vue cli2, cli3创建项目1.cli2方式创建npm i vue-cli -gvue init webpack myapp // 创建项目2.cli3方式创建npm i @vue/cli -gvue cteate myapp // 创建项目3.如果需要一台电脑同时使用两种方式,安装桥接工具就可以了(默认cli3会覆盖cli2)npm i @vue/cli-init -gvue init webpack myapp // cli2vue cteate myapp // cli
2020-08-17 11:21:18
192
原创 react native ScrollView包裹图片 图片无法全部显示的问题
react native 在使用ScrollView包裹图片 实现轮播图效果时,图片被遮挡原图:使用效果(完全按图片大小比例设置Image宽高):此时,只需在ScrollView外层加个View即可
2020-08-14 16:25:14
365
原创 react native 获取设备id
react native 获取设备id安装react-native-device-infonpm i react-native-device-info -S引用import { getUniqueId } from 'react-native-device-info';3.执行获取console.log("设备id", getUniqueId())
2020-08-12 15:02:18
1538
原创 react-native 配置全局loading,弹框,以及toast组件
react-native 配置全局loading,弹框,以及toast组件下载安装eventsnpm i events -S2.在src目录新建文件,src/utils/events.js,并写入以下代码// 这是events.jsimport { EventEmitter } from 'events';const Events = new EventEmitter();// loadingfunction ld () { Events.emit("loading",
2020-08-04 15:50:17
3470
原创 react-native 使用阿里云人机验证
阿里云人机验在react-native的使用方式,大概思路为:新建一个H5页面,调试成功之后,react-native借助WebView组件,引入这个H5页面即可实现。下面以滑块验证为例:直接按照阿里云文档配置即可。并加入以下代码(为了在rn获取到相关值,具体可了解postMessage的使用),配置完成后,将html上传至oss:阿里云人机验证var backData = { "tokenKey" : nc_token, "sessionId" : data.csessionid,
2020-07-15 15:47:17
1264
1
原创 react @指向src 配置
react配置 @指向src import login from '@/pages/login'1.创建react项目 create-react-app 项目名字2.进入创建的项目根目录,解压相关依赖 npm run eject3.解压之后,根目录会暴露出config文件夹。找到webpack.config.js → alias,新增 代码:"@": paths.appSrc, alias: { "@": paths.appSrc, },4.重启项目即可
2020-07-10 14:45:23
1850
原创 IE打开react项目空白页 不兼容 react-app-polyfill 使用配置
react-app-polyfill 使用配置react项目在IE打开不兼容解决办法:1.安装react-app-polyfill和core-jsnpm i react-app-polyfill core-js --save2.在src/index.js引入(需放在首行)import 'core-js/es' import 'react-app-polyfill/ie9' import 'react-app-polyfill/stable'3.修改package.json"pro
2020-07-09 16:36:19
2769
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人