Home>Article>Web Front-end> taro-script 0.4 released, learn about the js interpreter component based on Taro v3

taro-script 0.4 released, learn about the js interpreter component based on Taro v3

coldplay.xixi
coldplay.xixi forward
2020-09-10 17:25:26 1825browse

taro-script 0.4 released, learn about the js interpreter component based on Taro v3

Related learning recommendations:js video tutorial

Github address

Based onTaro v3development, supports multi-terminal small programs to dynamically load remote JavaScript scripts and execute them,supports ES5 syntax

Latest updates

  • Newly addeduseScriptContextGet the current execution context
  • Parameter name adjustment:useCache-> cache
  • Cache strategy adjustment
  • NewtextAttribute, you can directly pass in the js string
  • srcSupports arrays to solve the multi-layer TaroScript nesting problem

Usage

npm install --save taro-script复制代码
import TaroScript from "taro-script"; ;复制代码
import TaroScript from "taro-script";  Hello TaroScript ;复制代码

Note 1: The sametaro-scriptwill only be executed once, that is, aftercomponentDidMount. Subsequent changes to the properties will be invalid. Example

function App({ url }) { // 只会在第一次创建后加载并执行,后续组件的更新会忽略所有属性变动 return ; }复制代码

Note 2: Multipletaro-scriptwill be loaded in parallel and executed out of order, and the order cannot be guaranteed. For example:

// 并行加载及无序执行   复制代码

If you need to ensure the order of execution, you should use an array or nesting, for example:

Array method (recommended)

复制代码

Or nested way

    复制代码

globalContext

Built-in global execution context

import TaroScript, { globalContext } from "taro-script"; ;复制代码

At this timeglobalContext. The value of valueis100

CustomcontextExample

import TaroScript from "taro-script"; const app = getApp(); ;复制代码

this When the value ofapp.valueis100

TaroScriptattribute

src

Type:string | string[]

Remote script to load

text

Type :string | string[]

The JavaScript script string that needs to be executed,texthas a higher priority thansrc

context

Type:object

Default value:globalContext = {}

Execution context, Default isglobalContext

##timeout

Type:

numberDefault value:10000milliseconds

Set each remote script loading timeout

onExecSuccess

Type:

()=> void

Callback after successful script execution

onExecError

Type:

(err:Error)=> void

Script execution Callback after error

onLoad

Type:

() => void

Callback after the script is loaded and executed successfully ,

textis invalid when it exists

onError

Type:

(err: Error) => void

Callback after script loading failure or script execution error,

textis invalid when it exists

fallback

Type:

React.ReactNode

Display content of script loading, loading failure, and execution failure

cache

Type:

boolean

Default value:

true

Whether to enable load caching, the caching policy is to use the current request address as

key, and the caching period is the current user using the application Program life cycle.

children

Type:

React.ReactNode | ((context: T) => React.ReactNode)

The content displayed after loading is completed, supports passing in

functionThe first parameter is the context of script execution

useScriptContext()

Get the current execution context hook

import TaroScript, { useScriptContext } from "taro-script";   ; function Test() { const ctx = useScriptContext(); return ctx.a; // 100 }复制代码

evalScript(code: string, context?: {})

Dynamicly execute the given string script and return The value of the last expression

import { evalScript } from "taro-script"; const value = evalScript("100+200"); // 300复制代码

Others

    This component uses eval5 to parse
  • JavaScript

    syntax and supportsES5

  • Don’t forget to configure the legal domain name for the address that needs to be loaded before going to the production environment

  • TaroScript built-in types and methods:
  • 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,复制代码
The built-in types are related to the current running JavaScript environment. If the environment itself does not support it, it is not supported!

Import a custom method or type example:
import TaroScript, { globalContext } from "taro-script"; globalContext.hello = function(){ console.log('hello taro-script') } ;复制代码

or custom context

import TaroScript from "taro-script"; const ctx = { hello(){ console.log('hello taro-script') } } ;复制代码

If you want to learn more about programming, please stay tuned
phptraining

column!

The above is the detailed content of taro-script 0.4 released, learn about the js interpreter component based on Taro v3. For more information, please follow other related articles on the PHP Chinese website!

Statement:
This article is reproduced at:juejin.im. If there is any infringement, please contact admin@php.cn delete