title: flutter中实现调用原生js
date: 2023-01-25 18:00:34.085
updated: 2023-01-25 18:50:38.381
url: https://hexo.start237.top/archives/flutter中实现调用原生js
categories:
- IT技术
tags:
问题
在开发项目的时候遇到了,需要按着页面设置不同标题的需求。并且一个页面中有不同的元素,点击后需要设置标题为元素的名称。因为需要用到数据统计,所以需要设置网页标题
使用GetPage中设置了标题,不知道为什么不管事儿,网上搜索一下有没有flutter原生的实现api也没有找到。
所以就想到了调用原生js来实现这个需求的思路。
可能随着对flutter的深入了解,日后会有更加优雅的解决方案吧!
解决方案
import 'dart:js' as js;
import './utils.dart';
void setTitle(String title) {
if(PlatformUtils.isWeb) {
js.context.callMethod('setTitle',[title]);
}
}
<script>
function setTitle(name){
document.title = name;
}
</script>
如果是多平台编辑,在安卓和IOS中是不存在 dart:js的包的。所以需要在导包的时候进行判断
import 'package:Shine_like_a_star/utils/setPlatfromTitle.dart' if(dart.library.html) 'package:Shine_like_a_star/utils/setWebTitle.dart';
void setTitle(String title) {
print("默认的设置title"); // 这里什么都不要执行
}