FlutterにおけるJS実行について
Flutter Web なら JS を(多分簡単に)実行できますが、それ以外のプラットフォームは少し工夫する必要があります。
WebViewを使用する
code:sample.dart
import 'package:flutter/material.dart';
import 'package:webview_flutter/webview_flutter.dart';
class MarkdownMermaidPreview extends StatelessWidget {
final String markdownContent;
MarkdownMermaidPreview({required this.markdownContent});
@override
Widget build(BuildContext context) {
final String htmlContent = '''
<!DOCTYPE html>
<html>
<head>
<title>Markdown Preview</title>
<script>mermaid.initialize({ startOnLoad: true });</script>
</head>
<body>
<div class="mermaid">
${markdownContent}
</div>
</body>
</html>
''';
return WebView(
initialUrl: Uri.dataFromString(
htmlContent,
mimeType: 'text/html',
encoding: Encoding.getByName('utf-8'),
).toString(),
javascriptMode: JavascriptMode.unrestricted,
);
}
}
flutter_js を使用する
こっちのほうが楽そう?
試してみます。