sss大辉 - 博客园

webpack编写自定义Loader

摘要： loader我的理解是把非js的模块转换成js模块，毕竟浏览器只认识js语言官方的说法：loader 是导出为一个函数的 node 模块。该函数在 loader 转换资源的时候调用。给定的函数将调用 loader API，并通过 this 上下文访问。当处理一种类型模块的时候，多个loader配阅读全文

posted @ 2021-03-29 18:25 sss大辉阅读(612) 评论(0) 推荐(0)

react 条件渲染、列表渲染

摘要： 1.class组件 class Cc extends React.Component { state = { show: true, arr: [{ name: '121' }, { name: "2323" }, { name: '432435' }] } handleShow() { this. 阅读全文

posted @ 2021-03-29 14:20 sss大辉阅读(96) 评论(0) 推荐(0)

css三列布局(两边固定中间自适应)

摘要： 1.flex布局 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <style type="text/css"> #box { width: 100%; height: 100px; display: flex 阅读全文

posted @ 2021-03-29 11:42 sss大辉阅读(233) 评论(0) 推荐(0)

css垂直水平居中

摘要： 1.利用弹性布局 display: flex; align-items: center; justify-content: center; 2.绝对定位(知道宽高) position: absolute; top: 50%; left: 50%; height: 400px; width: 400p 阅读全文

posted @ 2021-03-29 10:34 sss大辉阅读(62) 评论(0) 推荐(0)

react 响应式数据

摘要： 1.class组件调用setState修改 1.setState是异步的,多次调用会合并为一次 2.修改同样数值的数据,仍会触发更新(解决方案:使用PureComponent) class Cc extends React.Component { state = { a: 1, c: [1, 2, 阅读全文

posted @ 2021-03-26 10:42 sss大辉阅读(103) 评论(0) 推荐(0)

mixin(混入)

摘要：看下官方介绍：混入 (mixin) 提供了一种非常灵活的方式，来分发 Vue 组件中的可复用功能。一个混入对象可以包含任意组件选项。当组件使用混入对象时，所有混入对象的选项将被“混合”进入该组件本身的选项。通俗易懂的话来说一个.vue文件由template，script，style组成，混入阅读全文

posted @ 2021-03-26 10:40 sss大辉阅读(242) 评论(0) 推荐(0)

vue插槽

摘要：什么是插槽，它是vue提出的一个概念，插槽用于决定将所携带的内容，插入到指定的某个位置，使得模块分块，具有模块化特质。插槽就是Vue实现的一套内容分发的API，将<slot></slot>元素作为承载分发内容的出口。 1.默认插槽正常来说我们在组件里编写东西，在组件内是不展示的但是在组件内加上阅读全文

posted @ 2021-03-26 10:37 sss大辉阅读(130) 评论(0) 推荐(0)

mvc与mvvm的设计思想

摘要： mvc: Model：数据模型，用来存储数据View：视图界面，用来展示UI界面和响应用户交互Controller：控制器(大管家角色)，监听模型数据的改变和控制视图行为、处理用户交互 mvvm: Vue为MVVM框架，当数据模型data变化时，页面视图会得到响应更新；其原理对data的gette 阅读全文

posted @ 2021-03-26 09:51 sss大辉阅读(104) 评论(0) 推荐(0)

:last-child 和 :last-of-type

摘要：作为CSS常用伪类选择器，:last-child经常会被用到; 但有时遇到极端情况，它会意外失效，让人摸不着头脑，例子如下：html: <div class="card"> 1 2 3 4 5 6 7 阅读全文

posted @ 2021-03-26 09:50 sss大辉阅读(459) 评论(0) 推荐(0)

react 事件绑定

摘要： 1.class组件 class组件中事件绑定会出现this丢失问题 1.给方法调用bind指向this 2.写成一个匿名箭头函数 3.方法本身写成箭头函数 4.若方法中带参数，只能用bind class Cc extends React.Component { f1(a?: any, b?: a 阅读全文

posted @ 2021-03-17 23:27 sss大辉阅读(92) 评论(0) 推荐(0)