一、css相关
1.不让选中文字的css设置,一般用于频繁点击的地方
user-select: none
2.css基础-特殊选择器
p:first-of-type是所有特定类型p的第一个子元素;只要是该类型元素的第一个就行,不要求是第一个子元素
span:first-child 匹配的是某父元素的第一个子元素,要求是第一个子元素且是span类型才会生效
附:相关博客学习
3.css中的var()函数
var(–name),可以再data里写name,给name赋值
4.css变形效果的学习
css变形效果博客
5.在css中英文字符超出div的宽度时默认不会换行,需要设置一下word-wrap : break-word ;
二、vue相关
1.vue自定义指令介绍钩子函数和钩子参数
附:博客学习参考
例子:按钮权限控制指令
import store from '@/store'
/**
* @description: 按钮权限逻辑
* @param {*} el
* @param {*} binding
* @param {*} vnode
* @author: Hemingway
* @example: v-menu-btn:edit="'/system/permission-setting'"
*/
function checkPermission(el, binding, vnode) {
const { arg, value } = binding
const currentMenuBtnList = vnode.context.$route.meta.menuBtn
const addRouteList = store.getters.addRouteList
const judgeRoute = () => {
if (
value &&
!addRouteList.map(route => route.fullPath).includes(value)
) {
el.parentNode.removeChild(el)
}
}
if (arg === 'redirect') {
judgeRoute()
} else {
if (!currentMenuBtnList.map(btn => btn.code).includes(arg)) {
el.parentNode.removeChild(el)
return
}
judgeRoute()
}
}
export default {
inserted(el, binding, vnode) {
checkPermission(el, binding, vnode)
}
}
2.使用v-if的时候,注意父元素要保持不变,同时有v-for的话不能使用index作为key,容易报错;为了方便可直接使用v-show。
3.判断vue中slot里是否有内容:$slots.插槽名,默认是default
三 、js相关
1.类型转换
+能将字符串数字直接转为number类型
!!能将number类型直接转为boolean类型
!!+能将字符串转为boolean类型