🔜 ,
Unterstützt die ES5-Syntax
Kürzlich aktualisierter Inhalt
useScriptContext hinzugefügt, um den aktuellen Ausführungskontext abzurufenAnpassung des Parameternamens : useCache-> Cache
Cache-Strategieanpassung
Neues text-Attribut, das direkt in js-String übergeben werden kann
src Unterstützt Arrays zur Lösung mehrstufiger TaroScript-VerschachtelungsproblemeTaro v3开发，支持多端小程序动态加载远程 JavaScript 脚本并执行，支持 ES5 语法
最近更新内容
- 新增
useScriptContext获取当前执行上下文
- 参数名称调整：useCache-> cache
- 缓存策略调整
- 新增
text属性，可直接传入js字符串
-
src支持数组，解决多层TaroScript嵌套问题
Usage
npm install --save taro-script复制代码
Nach dem Login kopieren
import TaroScript from "taro-script";
<TaroScript text="console.log(100+200)" />;复制代码
Nach dem Login kopieren
import TaroScript from "taro-script";
<TaroScript src="https://xxxxx/xx.js">
<View>Hello TaroScript</View>
</TaroScript>;复制代码
Nach dem Login kopieren
注 1：同一taro-script只会执行一次，也就是在componentDidMount后执行，后续改变属性是无效的。示例
function App({ url }) {
// 只会在第一次创建后加载并执行，后续组件的更新会忽略所有属性变动
return <TaroScript src={url} />;
}复制代码Nach dem Login kopieren
注 2：多个taro-script会并行加载及无序执行，无法保证顺序。如：
// 并行加载及无序执行
<TaroScript src="path1" />
<TaroScript src="path2" />
<TaroScript src="path3" />复制代码
Nach dem Login kopieren
如需要确保执行顺序，应该使用数组或嵌套，例如：
数组方式(建议)
<TaroScript src={["path1", "path2", "path3"]} />复制代码Nach dem Login kopieren
或 嵌套方式
<TaroScript src="path1">
<TaroScript src="path2">
<TaroScript src="path3"></TaroScript>
</TaroScript>
</TaroScript>复制代码
Nach dem Login kopieren
globalContext
内置的全局执行上下文
import TaroScript, { globalContext } from "taro-script";
<TaroScript text="var value = 100" />;复制代码Nach dem Login kopieren
此时 globalContext.value 的值为 100
自定义context示例
import TaroScript from "taro-script";
const app = getApp();
<TaroScript context={app} text="var value = 100" />;复制代码Nach dem Login kopieren
此时 app.value 的值为 100
TaroScript 属性
src
类型：string | string[]
要加载的远程脚本
text
类型：string | string[]
需要执行的 JavaScript 脚本字符串，text 优先级高于 src
context
类型：object
默认值：globalContext = {}
执行上下文，默认为globalContext
timeout
类型：number默认值：10000 毫秒
设置每个远程脚本加载超时时间
onExecSuccess
类型：()=> void
脚本执行成功后回调
onExecError
类型：(err:Error)=> void
脚本执行错误后回调
onLoad
类型：() => void
脚本加载完且执行成功后回调，text存在时无效
onError
类型：(err: Error) => void
脚本加载失败或脚本执行错误后回调，text存在时无效
fallback
类型：React.ReactNode
脚本加载中、加载失败、执行失败的显示内容
cache
类型：boolean
默认值：true
是否启用加载缓存，缓存策略是已当前请求地址作为key，缓存周期为当前用户在使用应用程序的生命周期。
children
类型：React.ReactNode | ((context: T) => React.ReactNode)
加载完成后显示的内容，支持传入函数第一个参数为脚本执行的上下文
useScriptContext()
获取当前执行上下文 hook
import TaroScript, { useScriptContext } from "taro-script";
<TaroScript text="var a= 100">
<Test />
</TaroScript>;
function Test() {
const ctx = useScriptContext();
return ctx.a; // 100
}复制代码Nach dem Login kopieren
evalScript(code: string, context?: {})
动态执行给定的字符串脚本，并返回最后一个表达式的值
import { evalScript } from "taro-script";
const value = evalScript("100+200"); // 300复制代码Nach dem Login kopieren
其他
-
该组件使用eval5来解析JavaScript语法，支持 ES5
Verwendung
NaN,Infinity,undefined,null,Object,Array,String,Boolean,Number,Date,RegExp,Error,URIError,TypeError,RangeError,SyntaxError,ReferenceError,Math,parseInt,parseFloat,isNaN,isFinite,decodeURI,decodeURIComponent,encodeURI,encodeURIComponent,escape,unescape,eval,Function,console,
setTimeout,
clearTimeout,
setInterval,
clearInterval,复制代码
Nach dem Login kopieren
import TaroScript, { globalContext } from "taro-script";
globalContext.hello = function(){
console.log('hello taro-script')
}
<TaroScript text="hello()"></TaroScript>;复制代码Nach dem Login kopieren
import TaroScript from "taro-script";
const ctx = {
hello(){
console.log('hello taro-script')
}
}
<TaroScript context={ctx} text="hello()"></TaroScript>;复制代码Nach dem Login kopieren
- Hinweis 1
: Wie taro-scriptEs wird nur einmal ausgeführt, d. h. nach componentDidMount sind spätere Änderungen an den Eigenschaften ungültig. Beispielrrreee
Hinweis 2 : Mehrere taro-script werden parallel geladen und in der falschen Reihenfolge ausgeführt, und die Reihenfolge kann nicht garantiert werden. Zum Beispiel: - rrreeeWenn Sie die Ausführungsreihenfolge sicherstellen müssen, sollten Sie Arrays oder Verschachtelungen verwenden, zum Beispiel:
Array-Methode (empfohlen)
rrreee
oder verschachtelte Methode
rrreee
globalContext
Eingebauter globaler Ausführungskontext
rrreee
Zu diesem Zeitpunkt ist der Wert von globalContext.value 100
Benutzerdefiniertes context-Beispiel
🎜rrreee🎜🎜Zu diesem Zeitpunkt ist der Wert von
app.value 100🎜🎜
TaroScript-Eigenschaften
src h3>🎜Typ: string |. string []🎜🎜Zu ladendes Remote-Skript🎜text
🎜Typ : string |. string[]🎜🎜JavaScript-Skriptzeichenfolge, die ausgeführt werden muss, <code>text hat eine höhere Priorität als src🎜context
🎜Typ: object🎜🎜Standardwert: globalContext = {}🎜🎜Ausführungskontext , Standard ist globalContext 🎜timeout
🎜Typ: numberStandard: 10000 Millisekunden🎜🎜 Legen Sie das Zeitlimit für das Laden jedes Remote-Skripts fest 🎜onExecSuccess
🎜Typ: ()= > void🎜 🎜Rückruf nach erfolgreicher Skriptausführung🎜onExecError
🎜Type: (err:Error) => void 🎜🎜Rückruf nach Skriptausführungsfehler🎜onLoad
🎜Typ: () => ; void🎜🎜 Rückruf, nachdem das Skript geladen und erfolgreich ausgeführt wurde. Es ist ungültig, wenn text vorhanden ist🎜onErrorcode>
🎜Type: (err: Error) => void🎜🎜Rückruf nach fehlgeschlagenem Laden des Skripts oder Fehler bei der Skriptausführung, ungültig, wenn text vorhanden ist🎜 fallback
🎜Typ:
React.ReactNode🎜🎜Zeigt den Inhalt des Skriptladens, des Ladefehlers und des Ausführungsfehlers an 🎜
cache
🎜Typ:
boolean🎜🎜Standardwert:
true🎜 🎜Ob der Ladecache aktiviert werden soll, ist die Cache-Richtlinie aktuell. Die Anforderungsadresse wird als
Schlüssel verwendet und der Cache-Zeitraum ist der Lebenszyklus des aktuellen Benutzers, der die Anwendung verwendet. 🎜
children
🎜Type:
React.ReactNode | ((context: T) => React.ReactNode)code>🎜🎜Der nach Abschluss des Ladevorgangs angezeigte Inhalt unterstützt die Übergabe von function. Der erste Parameter ist der context der Skriptausführung -16" >useScriptContext()🎜Den aktuellen Ausführungskontext-Hook abrufen🎜rrreeeevalScript(code: string, context? : {})
🎜Führen Sie das angegebene Zeichenfolgenskript dynamisch aus und geben Sie den Wert des letzten Ausdrucks zurück🎜rrreeeOther
🎜 🎜 Diese Komponente verwendet eval5 zum Parsen der JavaScript-Syntax und unterstützt ES5🎜🎜🎜🎜🎜Vergessen Sie nicht, einen zulässigen Domänennamen für die Adresse zu konfigurieren, die zuvor geladen werden muss Zur Produktionsumgebung wechseln🎜🎜🎜🎜🎜Integrierte TaroScript-Typen und -Methoden: 🎜🎜🎜rrreee🎜🎜Integrierte Typen beziehen sich auf die aktuell ausgeführte JavaScript-Umgebung. Wenn die Umgebung selbst dies nicht unterstützt, wird sie nicht unterstützt ! 🎜🎜🎜Beispiel für den Import benutzerdefinierter Methoden oder Typen: 🎜rrreee🎜oder benutzerdefinierter Kontext🎜rrreee🎜🎜Wenn Sie mehr über Programmierung erfahren möchten, achten Sie bitte auf die Spalte „PHP-Schulung“! 🎜🎜🎜
Das obige ist der detaillierte Inhalt vonTaro-Script 0.4 veröffentlicht, erfahren Sie mehr über die js-Interpreter-Komponente basierend auf Taro v3. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!
