fullcalendar.io可以在.net core Blazor中使用吗?
Posted
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了fullcalendar.io可以在.net core Blazor中使用吗?相关的知识,希望对你有一定的参考价值。
我尝试在Blazor Webassembly页面中使用FullCalendar。任何人都知道如何在Blazor中使用FullCalendar ???有人可以帮助我吗?
我将FullCalendar包含在libman.json中
"library": "@fullcalendar/core",
"provider": "unpkg",
"destination": "wwwroot/lib/fullCalendar"
在wwwroot / index.html中
<script src="_framework/blazor.webassembly.js"></script>
<script src="exampleJsInterop.js"></script>
wwwroot文件夹中的我的js文件“ exampleJsInterop.js”
window.exampleJsFunctions =
showPrompt: function (text)
return prompt(text, 'Type your name here');
,
displayWelcome: function (welcomeMessage)
document.getElementById('welcome').innerText = welcomeMessage;
,
calendar: function ()
document.getElementById("#calendar").fullCalendar(
schedulerLicenseKey: 'GPL-My-Project-Is-Open-Source',
editable: false,
allDaySlot: true,
eventLimit: true,
axisFormat: 'HH:mm',
slotLabelFormat: 'HH:mm',
aspectRatio: 2,
header:
left: 'today prev,next',
center: 'title',
right: 'month '
,
//defaultView: 'timelineDay',
selectable: true,
);
;
剃刀页面
@page "/fullCalendar"
@inject IJSRuntime JsRuntime;
<h1>FullCalendar</h1>
<button type="button" class="btn btn-primary" @onclick="test">
Bouton test
</button>
<div class="container">
<div id='calendar'></div>
</div>
@code
private async void test()
await JsRuntime.InvokeVoidAsync("exampleJsFunctions.calendar");
代码有什么问题?
错误:
((Microsoft.JSInterop.JSException:未定义$)main.js:1加载资源失败:服务器响应状态为404(未找到)blazor.webassembly.js:1调试热键:Shift + Alt + D(当应用程序具有焦点时)favicon.ico:1无法加载资源:服务器以状态404(未找到)响应blazor.webassembly.js:1 WASM:d.printErr @ blazor.webassembly.js:1put_char @ mono.js:1写@ mono.js:1写@ mono.js:1doWritev @ mono.js:1___syscall146 @ mono.js:1Module._mono_background_exec @ mono.js:1pump_message @ mono.js:1setTimeout(异步)_schedule_background_exec @ mono.js:1Module._mono_wasm_invoke_method @ mono.js:1callMethod @ blazor.webassembly.js:1beginInvokeDotNetFromJS @ blazor.webassembly.js:1l @ blazor.webassembly.js:1e.invokeMethodAsync @ blazor.webassembly.js:1(匿名)@ blazor.webassembly.js:1t.dispatchEvent @ blazor.webassembly.js:1(匿名)@ blazor.webassembly.js:1(匿名)@ blazor.webassembly.js:1e.onGlobalEvent @ blazor.webassembly.js:1再显示26帧blazor.webassembly.js:1 WASM:未处理的异常:d.printErr @ blazor.webassembly.js:1put_char @ mono.js:1写@ mono.js:1写@ mono.js:1doWritev @ mono.js:1___syscall146 @ mono.js:1Module._mono_background_exec @ mono.js:1pump_message @ mono.js:1setTimeout(异步)_schedule_background_exec @ mono.js:1Module._mono_wasm_invoke_method @ mono.js:1callMethod @ blazor.webassembly.js:1beginInvokeDotNetFromJS @ blazor.webassembly.js:1l @ blazor.webassembly.js:1e.invokeMethodAsync @ blazor.webassembly.js:1(匿名)@ blazor.webassembly.js:1t.dispatchEvent @ blazor.webassembly.js:1(匿名)@ blazor.webassembly.js:1(匿名)@ blazor.webassembly.js:1e.onGlobalEvent @ blazor.webassembly.js:1再显示26帧blazor.webassembly.js:1 WASM:Microsoft.JSInterop.JSException:$不是已定义d.printErr @ blazor.webassembly.js:1put_char @ mono.js:1写@ mono.js:1写@ mono.js:1doWritev @ mono.js:1___syscall146 @ mono.js:1Module._mono_background_exec @ mono.js:1pump_message @ mono.js:1setTimeout(异步)_schedule_background_exec @ mono.js:1Module._mono_wasm_invoke_method @ mono.js:1callMethod @ blazor.webassembly.js:1beginInvokeDotNetFromJS @ blazor.webassembly.js:1l @ blazor.webassembly.js:1e.invokeMethodAsync @ blazor.webassembly.js:1(匿名)@ blazor.webassembly.js:1t.dispatchEvent @ blazor.webassembly.js:1(匿名)@ blazor.webassembly.js:1(匿名)@ blazor.webassembly.js:1e.onGlobalEvent @ blazor.webassembly.js:1再显示26帧blazor.webassembly.js:1 WASM:ReferenceError:未定义$d.printErr @ blazor.webassembly.js:1put_char @ mono.js:1写@ mono.js:1写@ mono.js:1doWritev @ mono.js:1___syscall146 @ mono.js:1Module._mono_background_exec @ mono.js:1pump_message @ mono.js:1setTimeout(异步)_schedule_background_exec @ mono.js:1Module._mono_wasm_invoke_method @ mono.js:1callMethod @ blazor.webassembly.js:1beginInvokeDotNetFromJS @ blazor.webassembly.js:1l @ blazor.webassembly.js:1e.invokeMethodAsync @ blazor.webassembly.js:1(匿名)@ blazor.webassembly.js:1t.dispatchEvent @ blazor.webassembly.js:1(匿名)@ blazor.webassembly.js:1(匿名)@ blazor.webassembly.js:1e.onGlobalEvent @ blazor.webassembly.js:1再显示26帧blazor.webassembly.js:1 WASM:在testDan(http://localhost:53863/:30:17)d.printErr @ blazor.webassembly.js:1put_char @ mono.js:1写@ mono.js:1写@ mono.js:1doWritev @ mono.js:1___syscall146 @ mono.js:1Module._mono_background_exec @ mono.js:1pump_message @ mono.js:1setTimeout(异步)_schedule_background_exec @ mono.js:1
看来您需要加载一个jquery库。查看calender.io文档,看看是否需要jquery。这就是为什么您在“ $”上遇到错误的原因。
以上是关于fullcalendar.io可以在.net core Blazor中使用吗?的主要内容,如果未能解决你的问题,请参考以下文章
加载 fullcalendar.io 事件时出错 - 未显示数据
Fullcalendar.io在将事件属性解析为函数时出现问题
对 fullcalendar.io 使用普通的 PHP 路由 (&) 和 symfony 路由 (/)