我可以通过pickerDate vuetify传递参数吗?

Posted

技术标签:

【中文标题】我可以通过pickerDate vuetify传递参数吗?【英文标题】:Can I pass a parameter by pickerDate vuetify? 【发布时间】:2020-02-11 13:52:12 【问题描述】:

我的日期选择器是这样的:

<v-date-picker v-model="date" scrollable :picker-date.sync="pickerDate">

循环中的日期选择器

我的脚本是这样的:

  data: () => (
    date: new Date().toISOString().substr(0, 10),
    pickerDate: null,
  ),
  watch: 
    pickerDate (val) 
      console.log(val) 
    ,
  ,

在每个循环中,都有一个参数id,我想传递参数id

我尝试这样:

<v-date-picker v-model="date" scrollable :picker-date.sync="pickerDate(id)">

但存在错误:

Syntax Error: SyntaxError: Unexpected token

我该如何解决这个问题?

参考:https://vuetifyjs.com/en/components/date-pickers#date-pickers-react-to-displayed-month-year-change

【问题讨论】:

pickerDate 不是函数,但您将其用作一个函数。你想用id做什么? @tony19 当然可以 【参考方案1】:

你不能在picker-date中传递参数,但你仍然可以在Vuetify datepicker update:picker-date event 中传递 当您在 datepicker 中更改月份时,如果所选月份是 10 月,它将返回值为 2019-10。如果您更改 11 月,则该值将为 2019-11 并且 id 是您在迭代中传递的内容

      <v-date-picker
        v-model="date"
        class="mt-4"
        @update:picker-date="pickerUpdate($event, id)"
      ></v-date-picker>


new Vue(
  el: '#app',
  vuetify: new Vuetify(),
  data: () => (
    date: '2019-10-15',
    id: 5,
  ),
  methods: 
    pickerUpdate(val, id) 
      // you can read the val --> 2019-10 for october, id what you  are passing
      // when you iterate with multiple date picker, you can set id's 
      // write your async call here
       console.log('from picker update ' + val + '  id: ' + id );
    ,
  ,
)

【讨论】:

以上是关于我可以通过pickerDate vuetify传递参数吗?的主要内容,如果未能解决你的问题,请参考以下文章

Vuetify - 将道具传递给由 router-link 创建的标签

如何将 vuetify 组件正确地动态传递到 vueJs 组件中

谁能解释一下 vuetify 主题代码

在Vuetify和Vue JS中将道具传递给父母

Vuetify 数据表创建

Vuetify Data-Table Header 数组不接受空子关联