FullCalendar中eventContent如何同时使用HTML与arg参数
FullCalendar 自定义事件内容实现方案
完全可以同时实现动态数据读取和自定义HTML排版,两种配置能力本身就支持结合使用:eventContent 传入的回调函数返回值不限制为纯文本字符串,你可以直接在回调里返回带html属性的配置对象,html字段内可以自由拼接从arg参数拿到的事件动态属性,同时写任意自定义HTML结构控制排版。
针对你需要的「事件标题单独占一行、下一行展示places字段」的效果,直接用下面的写法即可:
eventContent: (arg) => { return { html: ` <div>${arg.event.title}</div> <div>${arg.event.extendedProps.places} Places</div> ` } }
如果需要更复杂的排版(比如加图标、区分字段样式、加额外标记),直接在html模板里加对应标签和class属性,后续写CSS控制样式即可,灵活性和纯静态HTML配置完全一致,同时保留了动态读取事件属性的能力。
内容的提问来源于stack exchange,提问作者Marc
相关产品推荐
相关产品推荐

