【问题标题】:Calendar is not displaying correctly using flatpickr使用 flatpickr 无法正确显示日历
【发布时间】:2017-04-21 15:05:39
【问题描述】:

我通过 npm install flatpickr 安装了 flatpickr。日历显示就像点击输入控件时一样

var React = require('React');
var ReactDOM = require('ReactDOM');
var Flatpickr = require('flatpickr');

var Calender = React.createClass({

    componentDidMount: function(){
    this.flatpickr = new Flatpickr(this.refs.date, {dateFormat: "m/d/Y"});
    },

    render: function() {
        return(
                <div>            
                    <input data-enable-time defaultValue='2016-11-11' ref="date_from" />    
                </div>
             );
    }
});

【问题讨论】:

    标签: node.js reactjs flatpickr


    【解决方案1】:

    我知道已经很久了,但是- 您需要将链接添加到 CSS 文件。

    在您的 SCSS 文件中:

    @import '../node_modules/flatpickr/dist/flatpickr.min.css';
    

    这是文档示例中的第一行:
    https://github.com/coderhaoxin/react-flatpickr
    (当我使用它时,我发现示例中的 css 文件名与我的不同,因此请在您的 node_modules 中仔细检查。)

    希望有所帮助。

    【讨论】:

    • 我面临同样的问题,答案似乎对我不起作用,因为它已经 2 岁了,还有其他解决方法吗?
    • 非常感谢。在别人开发的系统上工作。我完全忘了在新模板中添加 css,花了大约 3 个小时:(
    猜你喜欢
    • 2022-06-12
    • 1970-01-01
    • 2022-10-24
    • 1970-01-01
    • 1970-01-01
    • 2020-02-04
    • 1970-01-01
    • 2017-01-25
    • 2014-12-20
    相关资源
    最近更新 更多