我正在尝试为Flutter Web中的Playstore Application Badge创建HtmlElementView吗?
我尝试了以下提到的here
Widget _getAppStoreBadgeView() {
final NodeValidatorBuilder _htmlValidator =
new NodeValidatorBuilder.common()
..allowElement('a', attributes: ['data-target', 'data-toggle'])
..allowElement('button', attributes: ['data-target', 'data-toggle']);
ui.platformViewRegistry.registerViewFactory("idid", (int viewId) {
final element = DivElement()
..setInnerHtml(r"""
<a href='https://play.google.com/store/apps/details?id=com.shahxad.evendor&pcampaignid=pcampaignidMKT-Other-global-all-co-prtnr-py-PartBadge-Mar2515-1'><img alt='Get it on Google Play' src='https://play.google.com/intl/en_us/badges/static/images/badges/en_badge_web_generic.png'/></a>
""", validator: _htmlValidator)
..style.width = "100%"
..style.height = "100%"
..style.border = 'none';
return element;
});
return Container(
child: HtmlElementView(viewType: "idid"),
height: 150,
width: 400,
);
}
但是它不起作用,因为我越来越像这样。我在Chrome控制台中收到此消息。
Removing disallowed attribute
html_dart2js.dart:39901 Removing disallowed attribute <A href="https://play.google.com/store/apps/details?id=com.shahxad.flutter_tex_example&pcampaignid=pcampaignidMKT-Other-global-all-co-prtnr-py-PartBadge-Mar2515-1">
html_dart2js.dart:39901 Removing disallowed attribute <IMG src="https://play.google.com/intl/en_us/badges/static/images/badges/en_badge_web_generic.png">
最佳答案
将 dart:html 库中的NodeValidatorBuilder
与预定义规则allowHtml5
,allowNavigation
,allowImages
一起使用,并定义ItemUrlPolicy
类以允许从生成的 html -code进行导航。
import 'dart:html' as html;
import 'dart:ui' as ui;
import 'package:flutter/material.dart';
class ItemUrlPolicy implements html.UriPolicy {
RegExp regex = RegExp(r'(?:http://|https://)?.*');
bool allowsUri(String uri) {
return regex.hasMatch(uri);
}
}
class MyWidget extends StatefulWidget {
@override
MyWidgetState createState() => MyWidgetState();
}
class MyWidgetState extends State<MyWidget> {
html.DivElement _element;
@override
void initState() {
super.initState();
_element = html.DivElement()
..appendHtml("""
<a href='https://play.google.com/store/apps/details?id=com.shahxad.evendor&pcampaignid=pcampaignidMKT-Other-global-all-co-prtnr-py-PartBadge-Mar2515-1'>
<img alt='Get it on Google Play' src='https://play.google.com/intl/en_us/badges/static/images/badges/en_badge_web_generic.png'/>
</a>
""",
validator: html.NodeValidatorBuilder()
..allowHtml5(uriPolicy: ItemUrlPolicy())
..allowNavigation(ItemUrlPolicy())
..allowImages(ItemUrlPolicy()));
// ignore: undefined_prefixed_name
ui.platformViewRegistry.registerViewFactory('demo-view', (int viewId) => _element);
}
@override
Widget build(BuildContext context) {
return HtmlElementView(key: UniqueKey(), viewType: "demo-view");
}
}
关于flutter - Flutter Web,HtmlElementView, “Removing disallowed attribute”,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/62840032/