账号密码登录
微信安全登录
微信扫描二维码登录

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

手机验证码登录
找回密码返回
邮箱找回 手机找回
注册账号返回
其他登录方式
分享
  • 收藏
    X
    iview 二次封装DatePicker 绑定model 报错
    69
    0
    <Form :model="configMode" inline :label-width="configAll ? configAll.labelWidth : 80">
        <template v-for="(items, index) in configData">
            <template v-if="items.cut === 'input'" >
                <FormItem :label="items.label" :label-width="items.labelWidth" :key="index" >
                    <Input v-model="configMode[items.model]" :placeholder="items.placeholder" :style="`width:${items.width || configAll.width}px`"></Input>
                </FormItem>
             </template>
            <template  v-if="items.cut === 'select'">
                <FormItem :label="items.label" :label-width="items.labelWidth" :key="index">
                    <Select v-model="configMode[items.model]" :placeholder="items.placeholder" :style="`width:${items.width || configAll.width}px`">
                        <Option v-for="(option, ops) in items.options" :value="option.value" :key="ops+ 'o'">{{option.label}}</Option>
                    </Select>
                </FormItem>
            </template>
            <template v-if="items.cut === 'picker'">
                <FormItem :label="items.label" :label-width="items.labelWidth" :key="index">
                    <DatePicker 
                   
    
                         
    
    v-model="configMode[items.model]" 只要加上这句话就会报错
                        :type="items.type" 
                        :start-date = "new Date()"
                        :format="items.format"  
                        :placeholder="items.placeholder" 
                        :style="`width:${items.width || configAll.width}px`">
                    </DatePicker>
                </FormItem>
            </template>
            <template v-if="items.cut === 'button'">
                <template  v-for="(item, indexs) in items.buttonArr"> 
                    <FormItem :label-width="items.labelWidth || 40" :key="indexs + item.text">
                        <Button :type="item.type || 'primary'" @click="ventBus(item.evenName, configMode, item.attr)">{{item.text}}</Button>
                    </FormItem>
                </template>
            </template>
        </template>
    </Form>
    
    错误如下
    Error in render: "TypeError: date.getFullYear is not a function"
    date.getFullYear is not a function
    0
    打赏
    收藏
    点击回答
        全部回答
    • 0
    • 别打扰我开黑 普通会员 1楼

      在 iview 的二次封装版本中,如果你想使用DatePicker,你需要确保已经正确地将DatePicker实例绑定到你的数据模型。以下是一个示例:

      首先,你需要在你的数据模型中定义一个属性,这个属性将被用于存储日期和时间。

      javascript export default { data() { return { date: '' }; }, methods: { // 在这里定义你的日期验证逻辑 validateDate() { // 在这里进行日期验证 } }, // 在这里绑定你的DatePicker实例到数据模型 bindDate() { // 这里绑定你的DatePicker实例到你的数据模型 } };

      然后,在你的组件的模板中,你可以使用iview的日期选择器来选择日期。

      ```html <DatePicker v-model="date" placeholder="选择日期" @validate="validateDate"

      ```

      在这个例子中,@validate方法将在用户的输入发生更改时被调用。在这个方法中,你可以执行你的日期验证逻辑。

      注意,iview的日期选择器是基于字符串的,所以你需要确保你的日期格式是正确的。例如,如果你的日期格式是"YYYY-MM-DD",那么你需要使用"YYYY-MM-DD"而不是"YYYY-MM-DDT00:00:00"。

    更多回答
    扫一扫访问手机版
    • 回到顶部
    • 回到顶部