- 博客(31)
- 收藏
- 关注
RSS订阅原创 uni-app使用uIview的tabbar组件，实现自定义的字体图标
在阿里字体图标下载你需要的图标，格式为svg，下载两个颜色的，一个是激活的，一个是未激活的。下载好将图标文件放在根目录的static文件夹下。这里结合了 uIview的icon组件，slot值 分别规定了激活和未激活的样式。至此，需求得以实现。
2024-07-04 16:07:25
396
2
原创 解决积木报表项目本地引入CSS，字体图标不显示问题
中转换,上传 iconfont.ttf，.勾选 Family support , Base64 encode, TTF 三个选项, 点击 “Convert” 进行转化, 然后 “Download”解压后找到stylesheet.css把里面的内容（@font-face{}）拷贝到iviewuiplus.css(通过查阅发现是字体图标的.tff文件需要base64转换。,通过CDN方式引入，字体图标可以正常显示。这时会出现，字体图标不能正确显示的问题。重启项目，字体图标就能正常显示了。检查文件路径并无异常。
2024-03-15 15:45:52
493
原创 React国际化，基于react-i18next
基于i18next不仅限于react，学一次就可以用在其它地方提供多种组件在hoc、hook和class的情况下进行国际化操作适合服务端的渲染历史悠久，始于2011年比大多数的前端框架都要年长因为历史悠久所以更成熟，目前还没有i18next解决不了的国际化问题有许多插件的支持，比如可以用插件检测当前系统的语言环境，从服务器或者文件系统加载翻译资源。
2023-03-13 21:58:18
552
原创 Vue和React组件通信常用方式
Vue组件通信Vue父子组件通信1.父组件向子组件传值父组件通过在子组件的组件标签添加属性把值传递给子组件，子组件在props里声明接收父组件：<template> <div class="father"> <com-son :sons="sonList"></com-son> </div></template><script>import comSon from './son'expor
2022-03-02 18:33:48
971
原创 React错误边界
错误边界ErrorBoundary错误边界的意义在于，如果一个组件出现问题不会影响整个应用，导致渲染失败，转而提示用户“网络忙。。。”，比如A组件的子组件B 组件出了问题，可以应用错误边界，虽然也是显示不出正确页面，但是不至于程序报错。B 组件可能出错，那么需要在父组件A组件运用新增的钩子函数getDerivedStateFromProps()里写：state= {hasError:""}static getDerivedStateFromProps(error){ return {hass
2022-03-02 17:19:20
522
原创 React扩展--类似插槽的renderProps
renderProps有两个组件A、B，单看内部结构并不能看出父子关系，但会出现B组件可能作为A组件的情况，并要从A组件传值给B组件。如下：A组件：class A extends Component{state={name:"tom"}render(){return (<div><h1>我是A组件</h1></div>)}}B组件：class B extends Component{render(){return (&
2022-03-02 17:07:53
436
原创 高阶函数和函数的柯里化
高阶函数如果一个函数符合以下条件中任何一个1.若A函数，接收的参数是一个函数，那么A就是高阶函数2.若A函数调用的返回值依然是一个函数，那么A就是高阶函数常见的高阶函数有：Promise()、setTimeout()、arr.map()等函数的柯里化通过函数调用继续返回函数的方式，实现多次接收参数最后统一处理函数的编码形式。function sum(a){ return(b){ return(c){ a+b+c}}}...
2022-03-01 17:07:18
160
原创 React生命周期
旧生命周期原理图：可见，react包含如下生命周期函数：1.constructor()2.componentWillMount()3.render()4.componentDIdMount()5.componentWillUnmount()6.componentWillReceiveProps()7.shouldComponentUpdate()8.componentWillUpdate()9.componentDIdUpdate()其中3,4,5是最常用的，带“”will“”的2
2022-03-01 17:00:38
87
原创 React非受控组件和受控组件
1.非受控组件输入类的dom的值现用现取就是非受控组件，如下：class Login extends React.Component{handleSubmit = (event) {event.preventDefault()const {username,password} = this}render(){return (<form onSubmit = {this.handleSubmit }>用户名：<input ref = {c=>this.usernam
2022-03-01 00:48:12
195
原创 React三大属性state、props、refs
三大属性state、props、refs，function定义的函数式组件只能操作props，因为函数可以接收参数props。state类式组件特有，用于组件自身使用props用于从外部向组件内部传数据，方法是在组件标签里定义属性传递<Person name="lisi" age="19"/>在组件内部 通过props接收。另外可以对props的类型做限制，引入库。函数式组件利用参数接收propsclass Person extends ReactComponent(){ren
2022-03-01 00:17:41
88
原创 Vue路由器的两种工作模式
hash和history模式在路由定义的mode属性中，可以选择hash或者history1.对于一个url来说，什么是hash值？#及其后面的内容就是hash值2.hash值不包含在http请求中，即：hash值不会带给服务器3.hash模式：1.地址中永远带着#，不美观2.若以后将地址通过第三方app分享，若app校验严格，则地址会被标记为不合法3.兼容性好4.history模式：1.地址干净，美观2.兼容性较hash模式差3.应用部署上线时需要后端人员支持，解决刷新页面服务端40
2022-02-28 22:21:58
274
原创 Vue路由守卫（导航守卫）
路由守卫包括全局守卫（beforeEach()）、路由独享守卫(beforeEnter())、组件内守卫(beforeRouteEnter()、beforeRouteLeave())1.全局守卫（beforeEach()）1.全局前置路由守卫beforeEach()，初始化的时候调用，每次路由切换前调用。在定义路由router的时候，通过router.beforeEach()来做一些权限管理，比如一个页面需要登录权限，登录了的才能进入这个页面。在router.js文件router.beforeE
2022-02-28 19:35:46
464
原创 Vue的插槽
插槽：组件标签的标签体内容是不能解析的，要解析就要用到插槽，比如一个<Category/>插槽，一般使用的是自闭合就用上了这个插槽，但是如果<Category>你好！</Category>这个标签体内容“”你好！“”就不能解析出来，使用插槽解决问题。1.默认插槽在定义组件Category的时候<h2>呵呵呵</h2><slot></slot>这样“你好！”就会显示在<slot>的位置，相当于是挖了一个
2022-02-28 18:05:32
3137
原创 Vue、React脚手架解决跨域问题，配置代理
配置代理跨域问题是由于浏览器的同源策略出现的，即前端端发送Ajax到服务器请求数据，会发生跨域问题，导致拿不到返回的数据。常用3种方式解决：1.CORS这种方式是后端人员对请求做处理2.JSONP这种方式是在 script标签发请求，利用script不受同源的限制，缺点是只能发get请求，并且需要后端配合3.配置代理Vue脚手架处理跨域问题采用配置代理的方式，参考官方文档这里，比如当前前端处于http://localhost:8080，需要请求的数据在http://localhost:5000
2022-02-28 16:32:08
402
原创 React路由ReactRouter6
React路由ReactRouter6V6路由新增了一些东西，也做了一些替换，路由配置上跟vue更加相似，值得一提的是，react官方提倡函数组件，所以这个例子将使用函数组件说明。第一步安装路由npm install react-router-dom将会自动安装V6版本的路由。首先还是分清导航区和路由组件展示区，整理好布局左边的为导航区，右边为路由组件展示区，所以在APP组件里依然是定义路由链接import {NavLink,Link} from 'react-router-dom'Na
2022-02-24 22:38:24
4289
2
原创 vue状态管理vuex
说明：这个例子使用vue2.0 并且安装的vuex也要跟这个版本对应否则会出现各种各样的错误正确对应版本package.json里 "vue": "^2.6.14", "vuex": "^3.6.2"之前由于我安装的是vue3 所以我学的vuex都对应不上。vue2和vue3main.js代码都不同，加上vuex的版本也是不同为4.0，所以各种报错 ，下面为该例用的版本。npm install vuex@3目录结构vuex简单使用步骤1.安装vuexnpm install
2022-02-22 14:08:50
779
原创 react知识点
函数式组件 props.name,类式组件this.props.name**react 支持三种方式获取 ref，传统的字符串 ref，React.createRef()，回调函数，第一种需要从 refs 上去读取，第二种需要访问 myRef.current，回调函数写法:<input type=“text” ref={(node) => {this.myRef = node}} />你可以直接通过你声明的 myRef 直接访问，但是...
2022-02-19 15:04:08
174
原创 CSS知识点
意思是如果设置的不是max-width:500px，而是width:500px；那么当浏览器窗口小于500px；时会发生横向的滚动条，（横向滚动条不规范），如果是max-width的话，窗口大于或等于500就按500显示，如果窗口小于500 那么按照窗口大小显示，比如窗口只有300.那么元素的宽度就是300每个字母之间的距离 而不是单词就是说一段文字 如果超出了窗口大小，如果white-space:nowrap就不换行 出现横向滚动条，如果...
2022-02-11 21:30:07
168
原创 html知识点
1 This is a link 包含 元素 标签 元素内容 属性（键值对）2 pre 标签很适合显示计算机代码：for i = 1 to 10 print inext i使用 Target 属性，你可以定义被链接的文档在何处显示Visit W3School!alt 属性用来为图像定义一串预备的可替换的文本。替换文本属性的值是用户定义的。图像映射cellspacingcellpaddingid 必须包含至少一个字符，且不能包含空白字符（空格、制表符
2022-02-10 18:23:54
141
原创 VUE视频截图
VUE视频截图模板语法data的写法—不常用object.defineproterty数据绑定 双向代理VUE事件处理computed只能读不能改的computed 相当于只有get 没有set可以读 可以改的computed get和set都有...
2021-07-13 09:51:05
612
原创 uni-app
uniappsass安装 style里 lang=“scss”组件通信父传子子传父子组件中父组件中全局vue.prototype.baseurl="" 或者 app.vue里globalData插槽 （跟vue一样使用的）uni-ui使用步骤测试请求地址
2021-06-24 10:28:56
135
原创 微信小程序
微信小程序iconfont下载字体图标文件 以wxss的后缀引入然后这样用可滚动视图区域–区别于轮播图 类似于掌盟活动展示 那种单行文本溢出省略号多行文本溢出启动他的服务器请求受到限制解决封装功能函数先写好功能函数 然后找到动态的东西作为形参，以后通过传递实现动态，Promise风格使用封装的函数-引入函数所在的文件import，async await封装URL循环wx:for 默认是item为每个子元素自定义item名动态数据 双引号 里双花
2021-06-23 05:45:48
156
原创 React笔记
react笔记受控组件和非受控组件比如一个表单里有input需要获取值，两种方式，一种是ref；这就是非受控组件；一种是通过onChange事件获取。这相当于Vue的双向绑定，这就是受控组件；推荐使用受控组件，因为他没有用ref；官方说了勿过度使用ref。...
2021-06-18 17:32:02
208
原创 前端面试题准备
前端面试高频基础技术面试题原型和原型链实例会继承构造函数的方法//创建构造函数 function Word(words){ this.words = words; } Word.prototype = { alert(){ alert(this.words); } } //创建实例 var w = new Word("hello world"); w.print = function(){ console.log(this.words); console.log(this); //Person对
2021-06-18 17:31:09
486
原创 零乱知识点
零乱知识点css中的margin 或者 padding 值为4个、3个、2个、1个的时候，分别是什么意思？以margin为例，padding同理；margin为4个时，margin：上 右 下 左；（为顺时针方向）margin为3个时，margin：上 左=右 下；margin为2个时，margin：上=下 左=右；margin为1个时，margin：上=右=下=左；...
2021-06-18 17:30:29
150
原创 面试=实录
2021-3-26面试真题css做三角形1.形如rgb(255,255,255)到十六进制（FFFFFF）2.大驼峰到—下划线TodoItem变成to do-item3.输入日期哪天到哪天返回一个数组 里面的元素是中间的那些天数 2019-03-12这样的vuexvue缺点和好处mvvm防抖节流居中的方法守卫项目中做了什么访问后台的方法自己封装过没有vue组件传值ES6...
2021-06-18 17:29:58
253
原创 Vue看文档笔记
Vue看文档笔记单词：attribute–属性自定义组件名字只能是item-todo这种下划线形式，大小驼峰都不行；我们强烈推荐遵循 W3C 规范中的自定义组件名 (字母全小写且必须包含一个连字符)。这会帮助你避免和当前以及未来的 HTML 元素相冲突组件是可复用的 Vue 实例vue 组件自己也可以有data 不过是function的形式,一个组件的 data 选项必须是一个函数，因此每个实例可以维护一份被返回对象的独立的拷贝,也就是说，如果不是函数的返回形式，那么组件复用的时候，所有复用的组件
2021-06-18 17:28:34
141
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人