vue2实现Teleport,用来做跨组件DOM挂载
作者:admin 日期:2022-04-20父组件调用:(to="#app"的意思是把#divPopup挂载到#app节点上)
- <Teleport to="#app">
- <div id="divPopup" style="z-index:20000;" v-show="dialogVisible">
- <el-button @click="clickH1">yes</el-button>
- <el-button @click="clickH2">no</el-button>
- </div>
- </Teleport>
子组件:
- <script>
- export default {
- name: 'teleport',
- props: {
- /* 移动至哪个标签内,最好使用id */
- to: {
- type: String,
- required: true
- }
- },
- mounted() {
- document.querySelector(this.to).appendChild(this.$el)
- },
- destroyed() {
- document.querySelector(this.to).removeChild(this.$el)
- },
- render() {
- return <div>{this.$scopedSlots.default()}</div>
- }
- }
- </script>
一个swiper双向移动的例子
作者:admin 日期:2022-03-25飞机探测地块的一个小演示动画
作者:admin 日期:2022-03-25一个帧动画--仿做
作者:admin 日期:2022-03-25json-server+mock.js构建vue/小程序均可用的mock体系
作者:admin 日期:2022-03-03
lodash的get函数来判断对象深处的空值,太有用了!
作者:admin 日期:2022-01-21- let arr = [
- {id:1,tit:'ttt1'},
- {id:2,tit:'ttt2',bb:{ cc:{dd:12} }},
- {id:3,tit:'ttt3',bb:{}},
- {id:5,tit:'ttt5',bb:{ cc:{dd:''}}},
- {id:6,tit:'ttt6',bb:{ cc:{dd:null}}},
- {id:7,tit:'ttt7'},
- ]
- _.each(arr, item=>{
- let flag = _.get(item, [ 'bb', 'cc', 'dd' ])
- if(flag){
- console.log(item)
- }
- })