Rust Yew组件create函数中获取用户经纬度的方案咨询

方案1：基于Yew Context复用定位逻辑（零额外依赖，无生命周期问题） #

已经调通的use_geolocation()钩子是最稳定的定位实现，不需要为了跨组件复用重写底层Web API绑定逻辑，用Yew原生的Context机制即可实现全组件树共享定位结果：

• 在顶层父函数组件中调用use_geolocation()获取定位状态、经纬度、错误信息
• 通过yew::ContextProvider将定位相关状态封装为上下文，包裹需要使用定位信息的子组件树
• 子层级无论是函数组件还是Struct组件，都可以直接从上下文中读取定位值，无需重复发起定位请求
• 可以在上下文中统一处理定位加载、权限拒绝、坐标计算等逻辑，得到有效结果后再传递给底层子组件
  该方案完全避开了手动编写wasm闭包的生命周期坑，是Yew官方推荐的跨组件状态共享方案，维护成本最低。

方案2：直接在Struct组件create方法中调用定位API（无Seed依赖） #

如果需要直接在Struct组件的create生命周期内发起定位请求，不需要引入Seed框架，通过Yew自带的ComponentLink即可解决闭包生命周期问题。
首先保留Web API的wasm绑定定义：

#[wasm_bindgen]
extern "C" {
   type GeolocationCoordinates;
   #[wasm_bindgen(method, getter)]
   fn latitude(this: &GeolocationCoordinates) -> f64;
   #[wasm_bindgen(method, getter)]
   fn longitude(this: &GeolocationCoordinates) -> f64;
   type GeolocationPosition;
   #[wasm_bindgen(method, getter)]
   fn coords(this: &GeolocationPosition) -> GeolocationCoordinates;
}

为组件定义消息枚举，用于接收定位异步返回的结果：

pub enum Msg {
    PositionReceived(f64, f64),
    PositionError,
}

在组件结构体中增加闭包存储字段、经纬度存储字段：

pub struct FerryRoute {
    // 其他业务字段...
    geo_callback: Option<Closure<dyn Fn(JsValue)>>,
    lat: Option<f64>,
    lng: Option<f64>,
}

在create方法中构造'static生命周期的定位回调，发起定位请求：

fn create(ctx: &Context<Self>) -> Self {
    let link = ctx.link().clone();
    // 直接将克隆的link移入闭包，满足'static生命周期要求
    let geo_callback = Closure::wrap(Box::new(move |position: JsValue| {
        let pos: GeolocationPosition = position.unchecked_into();
        let coords = pos.coords();
        // 通过link向组件发送消息，传回经纬度
        link.send_message(Msg::PositionReceived(
            coords.latitude(),
            coords.longitude()
        ));
    }) as Box<dyn Fn(JsValue)>);

    // 获取浏览器定位实例
    let geolocation = web_sys::window()
        .expect("无法获取浏览器window对象")
        .navigator()
        .geolocation()
        .expect("当前浏览器不支持定位能力");
    
    // 发起定位请求
    geolocation.get_current_position(geo_callback.as_ref().unchecked_ref())
        .expect("发起定位请求失败");

    Self {
        // 其他字段初始化...
        geo_callback: Some(geo_callback),
        lat: None,
        lng: None,
    }
}

在组件update方法中处理定位返回结果，完成坐标计算：

fn update(&mut self, _ctx: &Context<Self>, msg: Self::Message) -> bool {
    match msg {
        Msg::PositionReceived(lat, lng) => {
            self.lat = Some(lat);
            self.lng = Some(lng);
            // 此处编写自定义坐标计算逻辑
            // 定位完成后释放闭包，避免内存占用
            self.geo_callback.take();
            true
        }
        Msg::PositionError => {
            // 处理定位失败、用户拒绝权限等逻辑
            self.geo_callback.take();
            true
        }
    }
}

在view方法中根据定位加载状态渲染内容，拿到有效坐标后传递给子组件：

fn view(&self, _ctx: &Context<Self>) -> Html {
    match (self.lat, self.lng) {
        (Some(lat), Some(lng)) => {
            // 传入计算后的结果给子组件
            html! { <ChildComponent lat={lat} lng={lng} /> }
        }
        None => html! { <div>{"正在获取定位信息..."}</div> }
    }
}

避坑说明：

• 不要调用geo_callback.forget()，该方法会导致闭包永久无法回收造成内存泄漏。将闭包存在组件结构体字段中，会随组件卸载自动释放，也可以在定位回调触发后主动调用take()提前释放。
• 构造闭包时不要在栈上创建中间回调再做引用，直接将所需的ComponentLink克隆后移入闭包，保证闭包捕获的所有值都满足'static生命周期要求，即可解决之前出现的"does not live long enough"编译错误。
• 引入Seed触发的编译错误本质是Seed 0.9.1依赖的wasm-bindgen版本与项目本地版本不兼容，完全不需要为了该功能引入整个Seed框架，Yew自带的消息机制完全可以替代Seed的orders能力。

内容的提问来源于stack exchange，提问作者djmcmath