前端小知识点

最新推荐文章于 2022-07-13 08:36:45 发布

南方的森林

最新推荐文章于 2022-07-13 08:36:45 发布

阅读量253

点赞数 1

分类专栏：前端文章标签：总结

本文链接：https://blog.csdn.net/Beryl2580/article/details/102910859

版权

前端专栏收录该内容

2 篇文章 0 订阅

订阅专栏

1. 绘制三角形

列表项前面标注

在这里插入图片描述

.triangleSpan{
        width: 0;
        height: 0;
        border-top: 4px solid transparent;
        border-left: 8px solid #FEA103;
        border-bottom: 4px solid transparent;
    }

点击查看如何绘出各种角度的三角形

2. margin、padding

值个数分别为1个、2个、3个、4个：
1: margin: 上 = 右 = 下 = 左;
2: margin: 上 = 下左 = 右;
3: margin: 上左 = 右下;
4: margin: 上右下左;（顺时针）

3. html特殊字符

后面加分号
’ < ’ ------ &lt；
’ > ’ ------ &gt；
’ <= ’ ------ &le；
’ >= ’ ------ &ge；
‘©’------ &copy；
‘空格’------ &nbsp；

HTML特殊字符编码对照表

4. 常用的正则表达式

账号前后不能含空格
let spaceReg = /^(\s+)|(\s+)$/
账号名称不能含有特殊字符
let specialReg = /^ [A-Za-z0-9_\u4e00-\u9fa5]{0,16}$/;
密码必须为6~15位的数字母或下划线
let pwdReg = /^ [0-9A-Za-z_]{6,15}$/;
密码不能含空格
let reg = /\s+/
邮箱格式
let emailReg = /^ [0-9a-zA-Z]+@[0-9a-zA-Z]+.[a-zA-Z]{3}$/
手机号格式
let phoneReg = /^1[3456789]\d{9}$/

一般登录注册这些就够用了~

当然~ 戳这有更全的常用正则

5.vue

1.路由传参
vue中动态路由的理解与使用
2.vue-router 异步组件按需加载
（1）使用以下方式把不同路由对应的组件分割成不同的代码块，然后当路由被访问的时候才加载对应组件，会更加高效。

import Vue from 'vue'
import Router from 'vue-router'

Vue.use(Router)

export default new Router({
 // 这个特殊的 `require` 语法将会告诉 webpack
  // 自动将你的构建代码切割成多个包，这些包
  // 会通过 Ajax 请求加载
  routes: [
    {
      path: '/',
      name: 'index',
      component: resolve => require(['@/views/index/index'], resolve)
    }
  ],
  mode:'history'
})

（2）使用import关键字引入,这个import(‘XXX’)函数会返回一个Promise对象

{
  path: '/',
  name: 'index',
  component:() => import('@/views/index/index')
 }

原文链接：vue-router 异步组件按需加载

（3）vue中使用import路由懒加载的原理、import和require的区别

6. css文本溢出隐藏

（1）单行

			width: 300px;
            overflow: hidden;
            white-space: nowrap;
            text-overflow: ellipsis;

（2）多行

			width: 300px;
            display: -webkit-box;   
            -webkit-box-orient: vertical;   
            -webkit-line-clamp: 2;   
            overflow: hidden;