如何在svelte中公开可以接受参数渲染的函数?

问题描述

我是Svelte的新手，对于我的用例，我想将Svelte应用程序导出为 bundle.js ，它公开了一个函数，例如 startApp(positionInject，appConfiguration)可以接受2个参数( positionInject 是应用程序注入位置，例如:.app， appConfiguration 是要启动的应用程序的初始配置)，基于这些参数可以使应用程序开始渲染.

I'm pretty new to svelte, and for my use case I would like to export the svelte app as a bundle.js which exposes a function let's say startApp(positionInject, appConfiguration) that can accept 2 parameters (positionInject is the app injection position eg: .app, appConfiguration is the initial configuration of the app to start), based on those parameters svelte app start renders.

我想知道，这真的可能吗?

I am wondering, this is possible in svelte?

感谢任何帮助.

推荐答案

每个Svelte组件都使用 target 元素和 props 作为构造函数参数.您可以将构造包装在一个函数中:

Every Svelte component takes a target element and props as constructor parameters. You can wrap the construction in a function:

import App from './App.svelte';

export function startApp(selector, props) {
  const target = document.querySelector(selector)

  return new App({
    target,
    props
  })
}

您可以这样称呼它:

import {startApp} from "./bundle.js"

startApp(".my-app", {config: ...})

这篇关于如何在svelte中公开可以接受参数渲染的函数?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！