Skip to content

Commit dbb999c

Browse files
Openblocks-docsgitbook-bot
Openblocks-docs
authored and
gitbook-bot
committed
GitBook: [lowcoder-org#101] No subject
1 parent 4ba1a8b commit dbb999c

File tree

6 files changed

+171
-0
lines changed

6 files changed

+171
-0
lines changed

‎docs/.gitbook/assets/builtin-js-appid.png

39.6 KB
Loading

‎docs/.gitbook/assets/builtin-js-globals.png

57.6 KB
Loading

‎docs/.gitbook/assets/builtin-js-local-storage.png

38.6 KB
Loading

‎docs/.gitbook/assets/builtin-js-messages.png

151 KB
Loading

‎docs/SUMMARY.md

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -29,6 +29,7 @@
2929
* [Write JavaScript in \{{ \}}](build-apps/write-javascript/write-javascript-in.md)
3030
* [Transformers](build-apps/write-javascript/transformers.md)
3131
* [Temporary state](build-apps/write-javascript/temporary-state.md)
32+
* [Built-in JS functions](build-apps/write-javascript/built-in-js-functions.md)
3233
* [Use third-party libraries](build-apps/use-third-party-libraries.md)
3334
* [Component guides](build-apps/component-guides/README.md)
3435
* [Option lists](build-apps/component-guides/option-lists.md)

‎docs/build-apps/write-javascript/built-in-js-functions.md

Lines changed: 170 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,170 @@
1+
# Built-in JS functions
2+
3+
## utils - utility functions
4+
5+
### utils.openUrl()
6+
7+
Open a URL.
8+
9+
```javascript
10+
// Syntax
11+
utils.openUrl( url: string, options?: { newTab: boolean = true } )
12+
```
13+
14+
| Parameter | Description |
15+
| -------------- | -------------------------------------------------------------------------------------------------------------------------- |
16+
| <p>url<br></p> | Required. A **String** value that specifies the URL to open. It must start with _http://_ or _https://_. |
17+
| newTab | Optional. **Boolean** value that, when **True**, specifies the url is to open in a new tab. The default value is **True**. |
18+
19+
```javascript
20+
// Example: Open google.com in a new tab.
21+
utils.openUrl("https://www.google.com", { newTab: true })
22+
```
23+
24+
### utils.openApp()
25+
26+
Open an Openblocks app.
27+
28+
```javascript
29+
// Syntax
30+
utils.openApp( applicationId: string, options?: { queryParams?: {"key":"value"}, hashParams?: {"key":"value"}, newTab: true } )
31+
```
32+
33+
| Parameter | Description |
34+
| --------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ |
35+
| <p>appId<br></p> | <p>Required. A <strong>String</strong> value that specifies the ID of the app to open.</p><p> <img src="../../.gitbook/assets/builtin-js-appid.png" alt="" data-size="original"></p> |
36+
| queryParams: {'key1':'value1',key2:'value2',...} | Optional. An **Object** that specifies query parameters to pass into the app. The query parameters are added to the app URL in the form of ?_key1=value1\&key2=value2&..._ |
37+
| <p>hashParams：{'key1':'value1',key2:'value2',...}<br></p> | Optional. An **Object** that specifies hash parameters to pass into the app. The hash parameters are added to the app URL in the form of _#key1=value1\&key2=value2&..._ |
38+
| newTab | Optional. A **Boolean** value that, when **True**, specifies the url is to open in a new tab. The default value is **True**. |
39+
40+
```javascript
41+
// Example: Open an Openblocks app in a new tab.
42+
utils.openApp("632bddc33bb9722fb888f6c0", { newTab: true })
43+
44+
// Example: Open an Openblocks app and pass in "id" parameter.
45+
utils.openApp("632bddc33bb9722fb888f6c0", {
46+
queryParams: { "id": table1.selectedRow.id },
47+
} )
48+
```
49+
50+
### utils.downloadFile()
51+
52+
Download a file containing the specified data.
53+
54+
```javascript
55+
// Syntax
56+
utils.downloadFile(data: any, fileName: string, options?: {
57+
fileType?: string,
58+
dataType?: "url" | "base64"
59+
} )
60+
```
61+
62+
| Parameter | Description |
63+
| --------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
64+
| data | Required. A **String** or **Object** that specifies the data to download from queries, components, transformers, etc. |
65+
| fileName | Required. A **String** value that specifies the name of the file to download. |
66+
| fileType | Optional. A **String** value that specifies the type of the file to download. All [MIME types](https://developer.mozilla.org/en-US/docs/Web/HTTP/Basics\_of\_HTTP/MIME\_types/Common\_types) are supported. |
67+
| dataType | Optional. A **String** value that specifies the type of the data: "url" or "base64". |
68+
69+
```javascript
70+
// Example: Download the base64 data from a file component as a PNG file named users-data.
71+
utils.downloadFile(file1.value[0], "users-data", {
72+
fileType: "png",
73+
dataType: "base64",
74+
})
75+
76+
77+
// Example: Download the results of query1 as a XLXS file named users-data.
78+
utils.downloadFile(query1.data, "users-data", { fileType: "xlsx" })
79+
// or in this way:
80+
utils.downloadFile(query1.data, "users-data.xlsx")
81+
82+
// Example: Download the results of query1 as a XLXS file named users-data.
83+
utils.downloadFile(restApiQuery.data, "users-data", {
84+
fileType: "pdf",
85+
dataType: "base64",
86+
})
87+
```
88+
89+
### utils.copyToClipboard()
90+
91+
Copy a string to clipboard.
92+
93+
```javascript
94+
// Syntax
95+
utils.copyToClipboard( text: string )
96+
```
97+
98+
| Parameter | Description |
99+
| --------- | ---------------------------------------------------------------- |
100+
| text | Required. A **String** value that specifies the content to copy. |
101+
102+
```javascript
103+
// Example: Copy the content of input component to clipboard.
104+
utils.copyToClipboard( input1.value )
105+
```
106+
107+
## message - global notification
108+
109+
Use `message` methods to send a global alert notification, which displays at the top of the screen and lasts for 3 seconds by default. Each of the following four methods supports a unique display style.
110+
111+
```javascript
112+
// message.info( text: string, options?: {duration: number = 3 } )
113+
message.info("Please confirm your information", { duration: 10 })
114+
// message.success( text: string, options?: {duration: number = 3 } )
115+
message.success("Query runs successfully", { duration: 10 })
116+
// message.warn( text: string, options?: {duration: number = 3 } )
117+
message.warn("Warning", { duration: 10 })
118+
// message.error( text: string, options?: {duration: number = 3 } )
119+
message.error("Query runs with error", { duration: 10 })
120+
```
121+
122+
<figure><img src="../../.gitbook/assets/builtin-js-messages.png" alt=""><figcaption></figcaption></figure>
123+
124+
## localStorage
125+
126+
Use `localStorage` methods to store and manage key-value pair data locally, which is not reset when the app refreshes, and can be accessed in any app within the workspace using `localStorage.values`.
127+
128+
| Method | Description |
129+
| ---------------------------------- | ------------------------------- |
130+
| setItem(_key: string, value: any_) | Store a key-value pair. |
131+
| removeItem(_key: string_) | Delete a key-value pair. |
132+
| clear() | Clear all data in localStorage. |
133+
134+
### localStorage.values
135+
136+
You can access any key-value pair in local storage using `localStorage.values.` in JavaScript queries.
137+
138+
<figure><img src="../../.gitbook/assets/builtin-js-local-storage.png" alt=""><figcaption></figcaption></figure>
139+
140+
Inspect the data in localStorage in **Globals** in the data browser.
141+
142+
<figure><img src="../../.gitbook/assets/builtin-js-globals.png" alt=""><figcaption></figcaption></figure>
143+
144+
### localStorage.setItem()
145+
146+
Store a key-value pair.
147+
148+
```javascript
149+
// Syntax
150+
localStorage.setItem(key: string, value: any)
151+
152+
// Example
153+
localStorage.setItem("order", select1.value)
154+
```
155+
156+
### localStorage.removeItem()
157+
158+
Delete a key-value pair.
159+
160+
```javascript
161+
// Syntax
162+
localStorage.removeItem(key: string)
163+
164+
// Example
165+
localStorage.removeItem("order")
166+
```
167+
168+
### localStorage.clear()
169+
170+
Clear all data in localStorage.

0 commit comments

Comments
 (0)