4

OnSelectSlot 在移动浏览器中不起作用。在 Android 设备中,我使用 chrome 浏览器对其进行了调试,但它不起作用。在 IOS 设备中,我使用 Safari 浏览器进行了调试,但也无法正常工作。在计算机浏览器中,单击它时可以流畅地运行,但在手机上则不然。有谁知道解决这个问题的方法?

下面是代码-------

           <BigCalendar
                selectable
                events={[
                    {
                        id: 0,
                        title: <div>{this.state.morningShiftAppointments + this.state.eveningShiftAppointments}<br/>
                            <div>{this.state.morningShiftAppointments}/{this.state.eveningShiftAppointments}</div>
                        </div>,
                        allDay: true,
                        start: new Date(this.state.year, this.state.month, this.state.date),
                        end: new Date(this.state.year, this.state.month, this.state.date),
                    }
                ]}
                views={['month']}
                onSelectSlot={this.onSelectSlot.bind(this)}
                dayPropGetter={customDayPropGetter}
                longPressThreshold={1}
                defaultDate={new Date()}
                eventPropGetter={
                    (event, start, end, isSelected) => {
                        let newStyle = {
                            backgroundColor: "lightgrey",
                            color: 'black',
                            borderRadius: "0px",
                            border: "none",
                            minWidth: "100%"
                        };
                        return {
                            className: "",
                            style: newStyle
                        };
                    }
                }
            />
4

2 回答 2

5

从 React-Big-Calendar 文档中:

longPressThreshold 指定用户必须在屏幕上按住多少毫秒才能将触摸视为“长按”。长按用于触摸设备上的时隙选择。

类型:数字默认值:250

于 2019-02-27T13:11:54.297 回答
1

尝试react-big-calendar通过重新安装来更新到最新版本。我做了这些步骤:

  1. 卸载:npm uninstall --save react-big-calendar
  2. 安装:npm install --save react-big-calendar
  3. 然后导入它:import { Calendar, momentLocalizer } from 'react-big-calendar';
  4. 如果需要,请添加 Localizerconst localizer = momentLocalizer(moment);
  5. 然后添加localizerprop yo 你的组件: <BigCalendar localizer={localizer} .../>

  6. 在最后一步将longPressThresholdprop 添加到您的组件(这允许 onSelectSlot 在移动设备上工作): <BigCalendar longPressThreshold={10} .../>

于 2020-01-08T14:17:47.640 回答