Javascript 如何在vuejs中将另一个道具内的道具用作默认值

我正在使用git hub提供的包为vuejs提供正负输入，在v2文件夹示例中有一个名为plusminusfield.vue的示例文件，这就是我使用它的原因：

 export default {
    props: {



        value: {
            default: 0,
            type: Number
        },
       base_capacity: {
            type: Number,
            required: true
        },
        min: {
             default: here I want to use the sent variable which is defined above and that is base_capacity 
 if I send a hard code like 5 it works well but I want to make it dynamic
             type:Number
        },
        max: {
            default: 22,
            type: Number
        },
    },
    data(){
        return {

            newValue: this.base_capacity,
        }
    },

以下是输入数的负数加和控制最大值和最小值的方法：

methods:{
        getNotificationClass (notification) {
            return `alert alert-${notification.type}`
        },
        mpminus: function () {
            if ((this.newValue) > this.min) {
                this.newValue = this.newValue - 1
                this.$emit('input', this.newValue)
            }

        },
        mpplus: function () {
            if (this.max === undefined || (this.newValue < this.max)) {
                this.newValue = this.newValue + 1
                this.$emit('input', this.newValue)
            }
        },

    },
 watch: {
        value: {
            handler: function (newVal, oldVal) {
                this.newValue = newVal
            }
        }
    },

---

因此，有没有任何方法可以让我从中传递输入的最小值？您不应该使用另一个

道具作为默认值。即使道具可用，您也无法保证道具的评估顺序

一个更好的方法是使用一个计算属性，该属性同时考虑了道具和组件内部的道具

computed: {
   minComputed () {
     return this.min ? this.min : this.base_capacity
   }
}

另外，从
min
的定义中删除
默认值，而不是直接使用它，使用工厂函数并返回值

此外，HTML属性区分大小写

示例：如果将属性设置为：
base capacity
，Vue将自动将其转换为驼峰大小写为
baseCapacity
，以从脚本访问它

这是官员


Vue.component（'加减'{
模板：“#vplusminus”，
道具：{
价值：{
默认值：0，
类型：编号
},
基本容量：{
默认值：0，
类型：编号
},
最小值：{
默认值：函数（）{
返回此值。基本容量
},
类型：编号
},
最大值：{
默认值：未定义，
类型：编号
}
},
数据（）{
返回{
新值：0
}
},
方法：{
getNotificationClass（通知）{
返回'alert alert-${notification.type}`
},
mpplus:function（）{
if（this.max==未定义的| |（this.newValuethis.min）{
this.newValue=this.newValue-1
this.$emit（'input'，this.newValue）
}
}
},
观察：{
价值：{
处理程序：函数（newVal、oldVal）{
this.newValue=newVal
}
}
},
已创建：函数（）{
this.newValue=this.value
}
});
新Vue({
el:“#应用程序”
});
.minusplusnumber{
边框：1px纯银；
边界半径：5px；
背景色：#FFF；
保证金：0 5px 0 5px；
显示：内联块；
用户选择：无；
}
.minusplusnumber分区{
显示：内联块；
}
.minusplusnumber#字段#容器输入{
宽度：50px；
文本对齐：居中；
字体大小：15px；
填充：3倍；
边界：无；
}
.minusplusnumber.mpbtn{
填充：3px10px 3px10px；
光标：指针；
边界半径：5px；
}
.minusplusnumber.mpbtn:悬停{
背景色：#DDD；
}
.minusplusnumber.mpbtn:活动{
背景色：#C5C5；
}

-
+
虽然接受的答案适用于Vue 2.x，但在Vue 3.x中，默认出厂功能不再具有访问此
的权限。相反，您可以将组件的道具作为参数传递给工厂函数：

道具：{
...
基本容量：{
默认值：0，
类型：编号
},
最小值：{
默认值：（props）=>props.baseCapacity，
类型：编号
},
...
},

请参阅迁移指南：
您可以在
创建的
（或
安装的
）挂钩中执行
this.newValue=this.base\u capacity
。我不相信可以将一个道具的默认值设置为另一个道具的值。@Farshad这是另一个错误。这是因为您正在更改代码中其他地方的
min
prop值。也许您将输入的模型设置为
min
，这不应该是您可以尝试使用函数返回的情况，但我只是在这里猜测，例如：
default:（）=>{return this.base_capacity；}
目前没有这种情况，组件尚未初始化。查看此链接它是一个输入它有最小值和最大值选项现在我想做什么将最小值设置为laravel发送的变量我只是想详细说明一下自己：）明白了，您的问题源于您试图将最小值的默认值设置为基本容量。但你的方法行不通。您需要定义一个min computed属性，并以min和base_capacity的props值为基础。你最终会得到你想要的功能。这是你的答案吗？？但是，当我再次尝试时，我得到了错误，请再次尝试。我编辑了我的答案，您还需要从min的定义中删除默认值。我认为将此函数添加到for-mp负：函数（）{if（（this.newValue）>this.min）{this.newValue=this.newValue-1 this.$emit（'input'，this.newValue）}因此，如果你不设置最小值，它将不起作用，也不会减去任何东西现在是这样的，我没有得到错误，但它不会起作用，这是我使用的组件，我没有得到你的答案。根据我对问题的理解，我更新了答案。你需要设置最小值的默认值，以确定容量，因此，如果你点击减号，你将得到最小值将值设置为12，即在组件的
基本容量下设置。我已将
：值设置为
16
，现在如果您单击减号按钮，您可以获得直到
12
，因为现在min设置为
12
。很酷。很高兴听到！
computed: {
   minComputed () {
     return this.min ? this.min : this.base_capacity
   }
}