Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[Bug Report] formily 中无法使用timepick的range 无法选择 #22976

Open
ssnfk opened this issue Oct 9, 2024 · 3 comments
Open

[Bug Report] formily 中无法使用timepick的range 无法选择 #22976

ssnfk opened this issue Oct 9, 2024 · 3 comments

Comments

@ssnfk
Copy link

ssnfk commented Oct 9, 2024

Element UI version

2.15.14

OS/Browsers version

windows egde

Vue version

2.7.16

Reproduction Link

https://codesandbox.io/s/tmmm85?file=/src/App.vue

Steps to reproduce

alibaba/formily#3241

What is Expected?

选则时间进行回显正确显示

What is actually happening?

选则时间无法正确显示

@wangdaodao
Copy link
Contributor

报错不影响数据回显,明显是你对formily使用错误,并且官方的文档示例也是错的。https://element.formilyjs.org/guide/time-picker.html#json-schema-%E6%A1%88%E4%BE%8B

你把代码改成这样看看:

<template>
  <FormProvider :form="form">
    <SchemaField>
      <SchemaStringField
        name="time"
        title="时间"
        required
        x-decorator="FormItem"
        x-component="TimePicker"
        :x-component-props="{
          style: {
            width: '240px',
          },
        }"
      />
      <SchemaStringField
        name="timeRange"
        title="时间范围"
        x-decorator="FormItem"
        x-component="TimePicker"
        :x-component-props="{
          isRange: true,
          style: {
            width: '240px'
          },
        }"
      />
    </SchemaField>
    <Submit @submit="log">提交</Submit>
  </FormProvider>
</template>

<script>
import { createForm } from '@formily/core'
import { createSchemaField, FormProvider } from '@formily/vue'
import { FormItem, TimePicker, Submit } from '@formily/element'

const form = createForm()
const fields = createSchemaField({
  components: {
    FormItem,
    TimePicker,
  },
})

export default {
  components: { FormProvider, ...fields, Submit },
  data() {
    return {
      form,
    }
  },
  methods: {
    log(value) {
      console.log(value)
    },
  },
}
</script>

图片

@ssnfk
Copy link
Author

ssnfk commented Oct 15, 2024

感谢,你的方法是可以的。但是formily/element-ui plus 和 formily/antd 都是使用 [startTime,endTime] 的写法,并且显示是正常的。这个应该是个解构赋值 这是 element ui plus 的输出
image

@wangdaodao
Copy link
Contributor

感谢,你的方法是可以的。但是formily/element-ui plus 和 formily/antd 都是使用 [startTime,endTime] 的写法,并且显示是正常的。这个应该是个解构赋值 这是 element ui plus 的输出
image

应该是封装的方式不同,具体得看下实现逻辑了。

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants