账号密码登录
忘记密码注册账号
微信安全登录
微信扫描二维码登录

登录后绑定QQ、微信即可实现信息互通

手机验证码登录
获取验证码
找回密码返回
邮箱找回 手机找回
获取验证码
注册账号返回
获取验证码
其他登录方式
登录即同意《用户使用协议》和《用户隐私条款》
问答主页 -> 电脑网络
分享
  • 收藏
    X
    js vue 更好的初始化data中的属性
    26
    0

    项目用的是vue，由于是做后台管理系统的，所以涉及很多的输入框，每个都v-model绑定属性。场景是:页面有一个“重新填写”的操作，这时，应该是清空所有的数据。目前我的做法是每个输入框作为data对象的属性都单独绑定一个属性，当点击‘重新填写’时，需要一个一个的取清空，这样的处理感觉不是很好。野路子出身，希望请教各位的做法。希望得到各位的指教，代码如下：

    data(){
        return {
            modalOrder:'',
            modalMachineName:'',
            modalWorkshopName:'',
            modalProcessName:'',
            modalRepairName:'',
            modalRepairTime:'',
            modalMaintainName:'',
            modalOrderName:'',
            modalOrderTime:'',
            modalOrderState:'',
            ...........
}

initEvent(){
            this.editModalStatus = false;
            this.modalOrder = '';
            this.modalMachineName = '';
            this.modalWorkshopName = '';
            this.modalProcessName = '';
            this.modalRepairName = '';
            this.modalRepairTime = '';
            this.modalMaintainName = '';
            this.modalOrderName = '';
            this.modalOrderTime = '';
            this.modalOrderState = '';
            this.modalFaultDescribe = '';
            this.modalRepairDescribe = '';
            this.modalRepairStart = '';
            this.selectFaultTypeId = '';
            this.modalRepairOver = '';
            this.modalFaultType = '';
            this.isRepair = '';
            this.replacePart = '';
            this.checkObj = null;
        },
    0
    打赏
    收藏
    点击回答
        全部回答
    • 共 0 条
    • 半抹灯芯 普通会员 1楼

      在 Vue.js 中，data 是一个对象，它存储了组件的数据。如果需要在初始化 data 时设置某些属性，可以使用 setup 函数。

      setup 是一个在组件挂载后执行的函数，它可以获取 data 对象的属性。以下是一个例子：

      javascript Vue.component('my-component', { setup() { // 在这里设置 `data` 对象的属性 this.data.name = 'John Doe'; this.data.age = 30; }, template: ` <div> <p>{{ name }}</p> <p>{{ age }}</p> </div> ` });

      在这个例子中，setup 函数在组件挂载后执行。在 setup 函数中，我们可以通过 this.data 对象来访问 data 对象的属性。

      如果你想在组件挂载前设置 data 对象的属性，可以在组件的 mounted 生命周期钩子中使用 setup 函数。以下是一个例子：

      javascript Vue.component('my-component', { mounted() { // 在这里设置 `data` 对象的属性 this.data.name = 'John Doe'; this.data.age = 30; }, template: ` <div> <p>{{ name }}</p> <p>{{ age }}</p> </div> ` });

      在这个例子中，mounted 生命周期钩子在组件挂载前执行。在 mounted 函数中，我们可以通过 this.data 对象来访问 data 对象的属性。

    0 打赏 回复
    更多回答
    网站公告
    扫一扫访问手机版

    回答动态

    • 回到顶部
    • 回到顶部