vue中data里面的数据相互使用方式

 更新时间:2022年06月05日 09:35:18   作者:她超甜i  
这篇文章主要介绍了vue中data里面的数据相互使用方式,具有很好的参考价值,希望对大家有所帮助。如有错误或未考虑完全的地方,望不吝赐教

data里面的数据相互使用

今天在写代码的时候,遇到一个问题,我想使用data里面的一个对象使用data里面的某个数据,附图片:

我想让active的值给params对象里面的topicListType使用,我不想直接在一个方法里面改变这个值(想改的话就直接可以改了,太简单),所以就有了这个想法。

在data里面使用,但是肯定不能写成 this.params.topicListType: this.active,这样会报错undefined,从网上查内容基本上都一样,也许是我看不懂,也许是我不会使用别人的,都不能用,我就自己鼓捣一会,他们使用的是mounted,但是我觉得得使用computed

具体代码如下

computed: {
  computedTabsActive() {
    return this.params.topicListType = this.active;
  },
},

这样就可以了,自己亲测有效,在vue中,computed的属性可以被视为是data一样,是可以读取和设值的,所以你可以直接赋值,返回。

但是很重要的一点,必须在模板中使用。摁,在模板中不让看见的话,我想大家都会把,用v-show或者v-if都可以。也算是投机取巧把。

data里的数据不能相互引用问题

如下图所示

如果需要相互引用,需要使用computed

以上为个人经验,希望能给大家一个参考,也希望大家多多支持脚本之家。

相关文章

  • 基于Vue实现电商SKU组合算法问题

    基于Vue实现电商SKU组合算法问题

    这篇文章主要介绍了基于Vue实现电商SKU组合算法问题 ,本文通过实例代码给大家介绍的非常详细,具有一定的参考借鉴价值,需要的朋友可以参考下
    2019-05-05
  • 详解在Vue中使用TypeScript的一些思考(实践)

    详解在Vue中使用TypeScript的一些思考(实践)

    这篇文章主要介绍了详解在Vue中使用TypeScript的一些思考(实践),小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2018-07-07
  • Vue实现嵌套菜单组件

    Vue实现嵌套菜单组件

    这篇文章主要为大家详细介绍了Vue实现嵌套菜单组件,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2022-07-07
  • Vue注册组件命名时不能用大写的原因浅析

    Vue注册组件命名时不能用大写的原因浅析

    这段时间一直在弄vue,当然也遇到很多问题,这里就来跟大家分享一些注册自定义模板组件的心得 ,需要的朋友可以参考下
    2019-04-04
  • vue中状态管理器Pinia的用法详解

    vue中状态管理器Pinia的用法详解

    Pinia 是 Vue.js 的轻量级状态管理库,最近很受欢迎,它使用 Vue 3 中的新反应系统来构建一个直观且完全类型化的状态管理库,下面就跟随小编一起来学习一下它的具体使用吧
    2023-10-10
  • 基于Vue2.0+ElementUI实现表格翻页功能

    基于Vue2.0+ElementUI实现表格翻页功能

    Element UI 是一套采用 Vue 2.0 作为基础框架实现的组件库,它面向企业级的后台应用,能够帮助你快速地搭建网站,极大地减少研发的人力与时间成本。这篇文章主要介绍了Vue2.0+ElementUI实现表格翻页功能,需要的朋友可以参考下
    2017-10-10
  • element plus如何为表格某列数据文字设置颜色样式

    element plus如何为表格某列数据文字设置颜色样式

    实习工作需要根据表格的状态字段来设置列的样式,所以这篇文章主要给大家介绍了关于element plus如何为表格某列数据文字设置颜色样式的相关资料,需要的朋友可以参考下
    2023-10-10
  • Vue.js 带下拉选项的输入框(Textbox with Dropdown)组件

    Vue.js 带下拉选项的输入框(Textbox with Dropdown)组件

    这篇文章主要介绍了Vue.js 带下拉选项的输入框(Textbox with Dropdown)组件,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2021-04-04
  • 深入浅析Vue.js计算属性和侦听器

    深入浅析Vue.js计算属性和侦听器

    这篇文章主要介绍了Vue.js计算属性和侦听器的相关资料,非常不错,具有参考借鉴价值,需要的朋友可以参考下
    2018-05-05
  • setup+ref+reactive实现vue3响应式功能

    setup+ref+reactive实现vue3响应式功能

    这篇文章介绍了通过setup+ref+reactive实现vue3响应式功能,文中通过示例代码介绍的非常详细。对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2021-11-11

最新评论