• Vue中this.$options.data()和this.$data知多少?


    1.场所描述

    如何获取vue-data中的所有值?
    如何获取vue-data中的某一个值?
    如何获取vue-data中的初始值?
    如何设置data中的值位初始值?
    

    2.主角登场 this.$options.data()和this.$data

    <template>
        <div>
            <button @click="gotos">改变</button>
            <button @click="obtain">获取改变后的值</button>
            <button @click="inithander">获取初始状态下的值</button>
            <button @click="reset">重置</button>
        </div>
    </template>
    <script>
    export default {
        data(){
            return{
                // https://www.jianshu.com/p/05697682a46f
                obj:{
                    name:'张三',
                    age:'李四',
                    sex:'男'
                },
                subjective:{
                    info:'ok'
                }
            }
        },
        methods:{
            gotos(){
                this.obj.sex='我改变了性别'
            },
            //获取vue中data中的所有值 当然data中的值也有可能是被改变了的
            obtain(){
                console.log('vue中data中的所有值',this.$data);
            },
            // 获取组件下初始状态下的值;就是你在data中最初写的值
            inithander(){
                console.log('初始状态下的值',this.$options.data());
            },
            // 重置值
            reset(){
                Object.assign(this.$data.obj,{name:'',age:'', sex:''});
                // 还可以使用   Object.assign(this.$data.obj,this.$options.data().obj); //前提是obj的值是空
                console.log('重置', this.obj )
            }
        }
    }
    </script>
    

    在这里插入图片描述

    作者:明月人倚楼
    出处:https://www.cnblogs.com/IwishIcould/

    想问问题,打赏了卑微的博主,求求你备注一下的扣扣或者微信;这样我好联系你;(っ•̀ω•́)っ✎⁾⁾!

    如果觉得这篇文章对你有小小的帮助的话,记得在右下角点个“推荐”哦,或者关注博主,在此感谢!

    万水千山总是情,打赏5毛买辣条行不行,所以如果你心情还比较高兴,也是可以扫码打赏博主(っ•̀ω•́)っ✎⁾⁾!

    想问问题,打赏了卑微的博主,求求你备注一下的扣扣或者微信;这样我好联系你;(っ•̀ω•́)っ✎⁾⁾!

    支付宝
    微信
    本文版权归作者所有,欢迎转载,未经作者同意须保留此段声明,在文章页面明显位置给出原文连接
    如果文中有什么错误,欢迎指出。以免更多的人被误导。
  • 相关阅读:
    整站爬虫命令
    小故事集锦
    中国最经典广告语大全
    常用的正则表达式
    特殊成员方法
    使用super函数----增量重写普通方法和构造方法
    重写普通方法和构造方法------原类的方法会被覆盖
    Python的数据类型与数据结构
    类和对象
    生产者-消费者问题与quene模块
  • 原文地址:https://www.cnblogs.com/IwishIcould/p/14713732.html
Copyright © 2020-2023  润新知