我们都知道,v-show的值是一个布尔类型的。
我通过这个值进行显示或者隐藏。
但是有些时候,这个值是true还是false,我们需要去进行计算
此时我们就可以使用v-show="XXX()"
通过XXX()这个方法来返回true或者false
 <div class="demo-div" v-show="comBoolenWay()">我是显示或者隐藏</div>

 methods: {
comBoolenWay() {
return true
}
},

如果这个数据不会频繁的发生该变,你也可以使用vue中的computed来进行缓存数据
conputed时有缓存的,当数据发生改变的时候,就会进行计算
  <div class="demo2-div" v-show="showWay">显示====隐藏</div>

  dec: "1213",

   computed: {
showWay: function () {
return this.dec ? true : false;
}
}, 当页面进行渲染的时候,就会去执行computed中的showWay方法,
如果值时true,这显示,否者就不显示。
我想问此时在created中写一个函数,computed中写一个函数 和 mounted中写一个函数
你知道函数的执行顺序吗 是created先执行。因为created是初始化data中的值。因此最先执行 然后是 执行computed中的,因为此时html正在被渲染,所以去执行computed 最后是monted()因为这个函数此时已经将页面渲染完成了。 <div class="demo2-div" v-show="showWay">显示====隐藏</div>
data(){
return{
dec: "1213",
}
} created() {
console.log("created");
}, mounted() {
console.log("mounted");
},
computed: {
showWay: function () {
console.log("computed");
return this.dec ? true : false;
}
},

vue中v-show你不知道的用法 created computed mounted的执行顺序的更多相关文章

  1. 详解Vue中watch的高级用法

    我们通过实例代码给大家分享了Vue中watch的高级用法,对此知识点有需要的朋友可以跟着学习下. 假设有如下代码: <div> <p>FullName: {{fullName} ...

  2. vue 中 命名视图的用法

    今天主要记录  vue中命名视图的用法 先奉上官网网址:https://router.vuejs.org/zh/guide/essentials/named-views.html 一般情况下,一个页面 ...

  3. javascript中的事件冒泡、事件捕获和事件执行顺序

    谈起JavaScript的 事件,事件冒泡.事件捕获.阻止默认事件这三个话题,无论是面试还是在平时的工作中,都很难避免. DOM事件标准定义了两种事件流,这两种事件流有着显著的不同并且可能对你的应用有 ...

  4. Java 中 try、catch、finally 语句块的执行顺序

    假设代码顺序书写如下:try → catch → finally → 其他代码 则: 1.正常执行顺序:try → catch → finally → 其他代码 2.try,catch和finally ...

  5. Vue中的methods、watch、computed

    看到这个标题就知道这篇文章接下来要讲的内容,我们在使用vue的时候methods.watch.computed这三个特性一定经常使用,因为它们是非常的有用,但是没有彻底的理解它们的区别和各自的使用场景 ...

  6. vue中watch的详细用法

    在vue中,使用watch来响应数据的变化.watch的用法大致有三种.下面代码是watch的一种简单的用法: <input type="text" v-model=&quo ...

  7. vue中watch的详细用法(转载)

    在vue中,使用watch来响应数据的变化.watch的用法大致有三种.下面代码是watch的一种简单的用法: <input type="text" v-model=&quo ...

  8. vue中this.$set的用法

    之前了解这个方法的时候,感觉这一辈子也用不到这个方法,因为当时没有应用场景,但是还真有用的时候,我相信你们也有用到时候. 从三个方面给大家说一下这个this.$set: 1.this.$set实现什么 ...

  9. vue中watch的详细用法(深度侦听)

    vsCode插件 在vue中,使用watch来响应数据的变化.watch的用法大致有三种.下面代码是watch的一种简单的用法: <input type="text" v-m ...

  10. vue中$ref的基本用法

    1.使用在一般的标签上 <div id="app"> <input ref="count" type="text" v-m ...

随机推荐

  1. 分析内部运行机制,教你解决Redis性能问题

    摘要:聚焦Redis的性能分析,思考Redis 可以通过哪些机制来提高性能,当性能瓶颈发生的时候,我们又能做出哪些优化策略,最终确保业务系统的稳定运行. 本文分享自华为云社区<分析内部运行机制, ...

  2. 为提高 SDLC 安全,GitHub 发布新功能|GitHub Universe 2022

    GitHub Universe 2022于上周举办.在此次大会上,Github 公布了开源软件状态的最新报告,报告中的统计数据显示,90% 的公司都在使用开源,现在 GitHub 上有9400万用户, ...

  3. 1024程序员节献礼,火山引擎ByteHouse带来三重产品福利

    更多技术交流.求职机会,欢迎关注字节跳动数据平台微信公众号,回复[1]进入官方交流.   随着信息技术飞速发展,互联网.Web3.物联网.人工智能相继出现. 在这近三十年的高速发展中,"程序 ...

  4. 大数据 - DWD&DIM 业务数据

    业务数据的变化,我们可以通过 FlinkCDC 采集到,但是 FlinkCDC 是把全部数据统一写入一个 Topic 中, 这些数据包括事实数据,也包含维度数据,这样显然不利于日后的数据处理,所以这个 ...

  5. Hugging News #0113:DreamBooth 编程马拉松活动保姆级视频教程来了!

    每一周,我们的同事都会向社区的成员们发布一些关于 Hugging Face 相关的更新,包括我们的产品和平台更新.社区活动.学习资源和内容更新.开源库和模型更新等,我们将其称之为「Hugging Ne ...

  6. 如何优化k8s中HPA的弹性速率

    本文分享自华为云社区<K8s 核心资源指标HPA性能优化之路>,作者:可以交个朋友. 一 背景 以弹性指标为cpu.memory为例.在Kubernetes 1.7版本中引入了聚合层,允许 ...

  7. 【django-vue】登录、注册前端实现 redis介绍 redis安装 python操作redis redis连接池 Redis之字符串类型

    目录 上节回顾 今日内容 1 登录前台 多方式登录 短信登录 Login.vue 2 注册前台 注册功能 Header.vue 3 redis介绍 3.1 redis应用场景 3.2 redis安装 ...

  8. 同步时间,为什么我选 Chrony 而不是 NTP ?

    初识 chrony chrony 是网络时间协议(Network Time Protocol )的通用实现 它不但可以提供保持系统时间与 NTP 时钟服务器同步的服务,还能作为 NTP 服务器对其他服 ...

  9. 【Protoc】VS2019 (VS平台) 使用 CMake 编译安装、使用 Protobuf 库

    背景:工作中需要使用到 protobuf,看了一些教程,感觉都不是很适合,便自己总结一些 开发环境: Win 10 VS2019 CMake 3.24.2 Protobuf 3.21.12 (Prot ...

  10. KYOCERA Programming Contest 2021(AtCoder Beginner Contest 200)(AB水题,C思维,D搜索,E DP)

    补题链接:Here A - Century 整除 \(200\) 并且判断能否整除完全 B - 200th ABC-200 按题意即可 C - Ringo's Favorite Numbers 2 求 ...