Andrew_SJ的博客

使用React，想要从外部加载一个gltf格式的demo模型，发现了很多坑。

接手一个老的vue项目，在登录跳转时总是报错：Uncaught(in promise) undefined，看到提示应该是属于vue-router的报错，但是直接点击无法看到相应报错代码片段。搜索后发现时vue-router3.1.0以上版本在push和replace时会返回promise，而代码中没有捕获该异常导致的。参考@朝阳&online的这篇。

npm install 报错 check python checking for Python executable python2 in the PATH

ant design库的高级组件库Pro Components中，Protable非常好用，但是最近在判断字段的时候发现对于非空值的判断出了问题。字段，当后端传来的数据为null时，经过逻辑。的判断，应该时将其渲染为一个短横杠字符。，因此三元表达式判断时其值实际已经变为。原因时Protable会在渲染时的。分析发现这里的判断逻辑中将为。，但是在实际的时候发现，当。，因此会将其渲染在列表中。字段识别为非空，且值为。解决办法：使用判断逻辑。的超链接，并且地址为。......

CSS居中css：盒子垂直水平居中的几种方法已知宽高：父，子盒子固定宽高，子绝父相，子盒子left50%，top50%，margin-left, margin-right子盒子宽高。父，子盒子固定宽高，子绝父相，子盒子left50%，top50%，transform: translate(-50%, -50%)。父，子盒子固定宽高，子绝父相，子盒子left, right, top, bottom全0，margin: auto。未知宽高：父盒子设置flex，justify-content:

阮一峰-CSS Grid 网格布局教程

https://www.cnblogs.com/webtaotao/p/11031723.html

cookie由于HTTP是一种无状态的协议，服务器单从网络连接上是无法知道客户身份的。这时候服务器就需要给客户端颁发一个cookie，用来确认用户的身份。cookie就是客户端保存用户信息的一种机制，用来记录用户的一些信息sessionSession是另一种记录客户状态的机制，不同的是Cookie保存在客户端浏览器中，而Session保存在服务器上。客户端浏览器访问服务器的时候，服务器把客户端信息以某种形式记录在服务器上。HTTP协议是无状态的，Session不能依据HTTP连接来判断是否为同一个

this 指向详细解析（箭头函数）

DOM的默认事件、事件模型、事件委托、阻止默认事件、冒泡事件的方式等

https://blog.youkuaiyun.com/fxbin123/article/details/80428216

什么是跨域？跨域是浏览器为了安全而做出的限制策略浏览器请求必须遵循同源策略：同域名、同端口、同协议怎样解决跨域问题？解决跨域的三种方法：CORS跨域JSONP跨域代理跨域CORS跨域：CORS跨域前端不用进行设置，后端直接添加上一段代码就可以后端直接设置允许某个域名进行访问header('Access-Control-Allow-Origin:https://segmentfault.com')或者允许所有域名进行访问header('Access-Control-Allo

1、介绍这里的vue代理是 vue静态服务器做代理。使用的是 http-proxy-middleware 这个模块（这个模块相当于是node.js的一个插件）。2、实际代码 //vue-cli3.0 里面的 vue.config.js做配置devServer: { proxy: { '/rng': { //这里最好有一个 / target: 'http://45.105.124.130:8081', // 后台接口域名

页面中已有内容，插入iframe，它的高度的计算方式：使用js获取页面剩余高度，针对不同尺寸设备可以独立获取剩余高度，实现响应式。使用flex布局的flex属性。#main div{ flex:1;}flex 属性用于设置或检索弹性盒模型对象的子元素如何分配空间。flex 属性是 flex-grow、flex-shrink 和 flex-basis 属性的简写属性。注意：如果元素不是弹性盒模型对象的子元素，则 flex 属性不起作用。flex-grow 一个数字，规定项目将相

传统做法拼接字符串和变量需要使用大量的“”（双引号）和 + 来拼接才能得到我们需要的模版。var name = 'jack'var age = 13var gender = 'female'console.log(name + "is a student, she is" + age + " and she is )ES6中提供了模版字符串，用`（反引号）标识，用${}将变量括起来。...

v-model 表单输入绑定使用v-model创建双向数据绑定, 用来监听用户的输入事件以更新数据<template> <div> <input class="login-input" type="text" v-model="username" placeholder="请输入账号"> <input class="login-input" type="password" v-model="password" p.

空数组是true，空字符串是false，0是false；var a = []if (a) { console.log(11)}var b = ''if (b) { console.log(22);}var c = 0if (c) { console.log(33);}打印结果：11原因：js中有默认的隐式转换。以下是数字和字符串隐试转换规则：任何非零的数为true，0为false。字符串来说任何非空字符串为 true，空字符串为false。所

测试组件时，需要遍历一下本地图片。发现直接给img绑定src属性为图片的url，图片无法显示。<template> <div v-for="item,index in pics" :key="index"> <img :src="item.img" alt=""> </div></template><script>export default { name: 'test', data() {

vue组件中，在style设置为scoped的时候，里面在写样式对子组件是不生效的，如果想让某些样式对所以子组件都生效，可以使用 /deep/ 深度选择器。在style经常用scoped属性实现组件的私有化时，要改变element-ui某个深层元素（eg:.el-input__inner）或其他深层样式时，需要使用/deep/。我们都知道Scoped CSS规范是Web组件产生不污染其他组件，也不被其他组件污染的CSS规范。这样在打包的时候会生成一个独一无二hash值，这样父组件的样式就不会影响到子组件

注意在vue项目中引用Swiper插件时，需要指定vue：// 正确import { Swiper, SwiperSlide } from 'swiper/vue'// 错误import { Swiper, SwiperSlide } from 'swiper'

var arr1 = []var arr2 = [1, 2]if(arr1) {console.log(111)}if(arr2) {console.log(222)}打印结果：111222说明空数组是true.

给标签设置了宽度，但是没有成功换行。查询后发现问题如下：如果是一串很长的字符，中间没有任何空格，比如：dfadfasdfsadfsadfsdjfklosdfjaskdfjlsdkfsajdlfjasdfjksdfsodfusiodfas系统会认为它是一个单词，不会自动换行，需要一段正常的带空格的文本才能换行。...

?:?:是指可选参数，可以理解为参数自动加上undefinedfunction echo(x: number, y?: number) { // 可选参数 return x + (y || 0);}getval(1); // 1getval(1, null); // error, 'null' is not assignable to 'number | undefined'interface IProListForm { enterpriseId: string | number;

data的三种写法在vue中，定义data可以有三种写法。1.第一种写法，对象。var app = new Vue({　　el: '#yanggb',　　data: {　　　　yanggb: 'yanggb'　　}})2.第二种写法，函数。var app = new Vue({　　el: '#yanggb',　　data: function() {　　　　return {　　　　　　yanggb: 'yanggb'　　　　}　　}})3.第三种写法，函数，是第二种写法

1，什么是BFC？1）BFC(Block formatting context)直译为“块级格式化上下文”。BFC它是一个独立的渲染区域，只有Block-level box（块元素）参与，它规定了内部的Block-level box如何布局，并且与这个区域外部毫不相关。2）可以理解成：创建了 BFC的元素就是一个独立的盒子，里面的子元素不会在布局上影响外面的元素（里面怎么布局都不会影响外部），BFC仍属于文档中的普通流3）不是所有的元素，模式都能产生BFC 。w3c规范：display属性为block

https://blog.youkuaiyun.com/sinat_17775997/article/details/107330082https://blog.youkuaiyun.com/sinat_17775997/article/details/90319013

https://segmentfault.com/q/1010000019939513Intersection Types

https://cloud.tencent.com/developer/article/1535603

JavaScript 实现页面跳转重定向可以使用以下两种方法：1. window.location.replace(“url”)类似 HTTP 重定向将地址替换成新 url，该方法通过指定 URL 替换当前缓存在历史里（客户端）的项目，因此当使用 replace 方法之后，你不能通过"前进"和"后退"来访问已经被替换的URL，这个特点对于做一些过渡页面非常有用！2. window.location.href=“url”类似点击 a 标签的链接。跳转到指定的 url。例子：// 类似 HTTP

摘自《JavaScript高级程序设计第四版》第九章 代理与反射ECMAScript 6新增的代理和反射为开发者提供了拦截并向基本操作嵌入额外行为的能力。具体地说，可以给目标对象定义一个关联的代理对象，而这个代理对象可以作为抽象的目标对象来使用。在对目标对象的各种操作影响目标对象之前，可以在代理对象中对这些操作加以控制。代理是目标对象的抽象。从很多方面看，代理类似C++指针，因为它可以用作目标对象的替身，但又完全独立于目标对象。目标对象既可以直接被操作，也可以通过代理来操作。但直接操作会绕过代理施予的行

添加远程仓库：git remote add origin [远程仓库地址：如https://www.github.com/xxx/project-1.git]将远程仓库代码拉到本地git pull origin [远程仓库下某一分支，如：branch-test]

按Q。

一： 点击div跳转新页面.不要用<router-link :to="..."></router-link>包裹div，而是给div绑定点击事件，再用$route.push()方法做路由跳转。例子：<div class="flex-grow w-40 h-36 ml-4 pl-5 pt-6 text-xl text-white" style="background-color: #2e7d32" @click="$router.push({name:'Furniture

https://www.runoob.com/jsref/met-loc-replace.htmlreplace() 方法可用一个新文档取代当前文档。

一个需求：a页面有多个一类产品的展示，每个一类产品可以点击，然后跳转到该一类产品的详情页面，该页面会有获取当前页面所属一类产品名称或者其他相关属性的需要。可以使用路由传参的query来获取当前页面前一页面的属性。用途：面包屑制作，需要当前页面的前一页面的名称。之前的很蠢的做法：用产品的id做params匹配，然后通过$route.params.productId获取路由匹配参数: 当前产品的id。之后再通过产品表通过id获取产品name。太傻了// 产品详情页路由：// 使用了params

js编码解码decodeURI()与decodeURIComponent()的区别

一、URI<1>什么是URIURI，统一资源标志符(Uniform Resource Identifier， URI)，表示的是web上每一种可用的资源，如 HTML文档、图像、视频片段、程序等都由一个URI进行标识的。<2>URI的结构组成URI通常由三部分组成：①资源的命名机制；②存放资源的主机名；③资源自身的名称。（注意：这只是一般URI资源的命名方式，只要是可以唯一标识资源的都被称为URI，上面三条合在一起是URI的充分不必要条件）<3>URI举

W3C-CSS基础教程-CSS变量IwYvI-【译】深入了解CSS自定义属性笨小子仓库-css 自定义属性（@apply var）

有这样一个需求：要求将文字与icon作为一个盒子，盒子内文字与icon水平垂直居中，且盒子可以放在屏幕的任意位置：比如左侧或者右侧或者居中，且具有响应式的特点。思路如下：首先，用一个div包裹两个子div文字和icon。父盒子宽高已经指定，子盒子内其余属性设置好。<div class="w-20 h-10 bg-blue-300 flex"> <div class="text-base text-white">联系我们</div> <img

转载自@liya_nan，css中的mixin及其用法一、mixin是什么？@mixin是一种简化代码的方法，能够提高代码的重复使用率。二、mixin的用法mixin定义（使用@mixin定义）：@mixin hexagon-generator($hexagon-width, $factor, $border-radius){ display: inline-block; border-radius: 50%; width: ($hexagon-width + $border-rad