vue.js - Prop not Reactive 使用 VUE 发送配置
问题描述
我已经开始学习 Vue 并且已经走了很远 :) 但仍然认为自己是初学者。我买了一个基于vue的单页应用模板 Themeforest Template Link
我正在上面构建我的应用程序,它使用FlatPickr
我正在尝试使用 FlatPickr 的启用功能
{
enable: ["2025-03-30", "2025-05-21", "2025-06-08", new Date(2025, 8, 9) ]
}
我问开发人员如何使用它,因为它没有在说明中,所以他回答:
您可以使用该
config
道具传递所有 Flatpickr 选项。
我有看起来像这样的代码
<c-flatpickr
v-validate="'required'"
v-model="dateRange"
:config="enabledDates"
name="Select Date Range"
value="" range
/>
enabledDates: function (){
var data = this.trip.tripsDetails;
var options = {
enable: [],
};
for (let i in data){
options.enable.push(data[i].startingDate);
}
return options;
},
我的问题是,如果我静态传递数据它可以工作,所以如果我手动将值放入数组中
var options = {
enable: ['01-06-2018', '03-06-2018', '06-06-2018'],
};
它可以工作,但如果我尝试动态推送值(根据我上面的代码),它就不起作用。
我究竟做错了什么?
提前感谢您的帮助。
// 这里是代码
data() {
return {
trip: new Form({
//All Trips
tripsDetails: [],
}),
dateRange: undefined,
}
},
methods: {
getData(pageid){
this.trip.tripsDetails = [];
axios
.get('/trip/getTrips',{
params: {
equipment_id : this.trip.equipment_id,
dispatch_id: this.pageid
}
})
.then(response => {
this.trip.tripsDetails = response.data.data;
this.loading();
}).catch(error => {
this.loading();
this.errortoast();
});
},
解决方案
推荐阅读
- css - Material UI Theme 中的前景色和背景色
- payment-gateway - 如何在 Square Payment Gateway 中设置每 2 个月或 3 个月订阅一次
- flutter - 颤动的文本小部件内的几个单词之间的字母间距太大。如何删除不需要的空间?
- php - 适配mysqli代码的mysql代码留下页面空白
- reactjs - 在 useEffect 中使用额外依赖的后果是什么?
- xquery - MarkLogic:如何获取数据库中所有文档的计数,并具有 rest-reader、rest-writer 权限?
- c++ - C++ -> 哪个更快?诠释一个(5);或int a = 5;
- c++ - 如何创建模板嵌套模板参数包?
- laravel - 通过 laravel Validation 验证日期时间
- java - 使用 kotlin 字节码将 Kotlin 转换为 Java 会产生带有错误的 Java 代码