uniapp技巧-dom的显示和隐藏

今天碰到一个新的需求,就是需要某个dom在加载的时候不显示,等到5秒后再显示。寻找了一些方法,最后发现还是可以通过js来实现,只不过方法与h5+js的时候略有不同,方法如下:

1、dom增加属性

<view  :class="isShow" >内容内容</view>

2、data中增加isShow默认值

data() {

return{

isShow: "domhide",

}

}

3、在style中声明domhide和domshow两个class

.domhide{display: none;}

.domshow{display: block;}

4、在load中增加计时程序

onLoad() {

if (this.timer) {

clearInterval(this.timer);

}

this.timer = setInterval(() => {

this.isShow= "domshow";

}, 5000);

},

以上

比起直接使用h5+js麻烦一点,记录一下。

有其他更简单的方法,可以告诉我大家交流一下。

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 一、初始Vue 1. 初始Vue 第一步:给Vue准备一个容器: <!-- 在页面中,通过插值表达式可以直接使用V...
    葛瑞丝阅读 263评论 0 0
  • ====DOM==================================================...
    悦动燃爆阅读 235评论 0 0
  • 什么是Vue.js Vue.js是目前最火的一个前端框架,React是最流行的一个前端框架,(React除了开发网...
    EEEEsun阅读 677评论 0 1
  • 第一章 1.什么是DOM DOM: Document Object Model(文档对象模型) 是JavaScri...
    fastwe阅读 842评论 0 0
  • 1 回到顶部es6版面向对象+原生JS实例 代码:HTML代码: <!DOCTYPE html> ...
    果木山阅读 195评论 0 0