mirror of
https://gitee.com/baidu/amis.git
synced 2024-11-29 18:48:45 +08:00
docs: 修复官网在 IE11 下打不开问题 (#2602)
This commit is contained in:
parent
9770f2e3e1
commit
7407b6223c
2
.gitignore
vendored
2
.gitignore
vendored
@ -21,7 +21,7 @@ node_modules
|
||||
/toolkit/amis-renderer
|
||||
/toolkit/output
|
||||
/coverage
|
||||
/package-lock.json
|
||||
package-lock.json
|
||||
/schema.json
|
||||
/npm
|
||||
/mock/cfc/cfc.zip
|
||||
|
@ -14,26 +14,48 @@ order: 73
|
||||
|
||||
比如下面这个 web component
|
||||
|
||||
```
|
||||
```html
|
||||
<random-number prefix="hello" class="my-class"></random-number>
|
||||
```
|
||||
|
||||
对应代码类似
|
||||
|
||||
```javascript
|
||||
import '@webcomponents/webcomponentsjs/custom-elements-es5-adapter';
|
||||
|
||||
class RandomNumber extends HTMLElement {
|
||||
connectedCallback() {
|
||||
const prefix = this.getAttribute('prefix') || '';
|
||||
const shadow = this.attachShadow({mode: 'open'});
|
||||
const text = document.createElement('span');
|
||||
text.textContent = `${prefix}: ${Math.floor(Math.random() * 1000)}`;
|
||||
shadow.appendChild(text);
|
||||
setInterval(function () {
|
||||
const count = `${prefix}: ${Math.floor(Math.random() * 1000)}`;
|
||||
text.textContent = count;
|
||||
}, 2000);
|
||||
}
|
||||
}
|
||||
|
||||
customElements.define('random-number', RandomNumber);
|
||||
```
|
||||
|
||||
使用 amis 可以这样渲染出来
|
||||
|
||||
```schema: scope="body"
|
||||
```json
|
||||
{
|
||||
"type": "web-component",
|
||||
"tag": "random-number",
|
||||
"props": {
|
||||
"prefix": "hello",
|
||||
"class": "my-class"
|
||||
}
|
||||
"type": "web-component",
|
||||
"tag": "random-number",
|
||||
"props": {
|
||||
"prefix": "hello",
|
||||
"class": "my-class"
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
其中 `tag` 指定标签,属性放在 `props` 对象里,props 里的值支持变量替换,比如:
|
||||
|
||||
```schema
|
||||
```json
|
||||
{
|
||||
"data": {
|
||||
"text": "World"
|
||||
@ -47,7 +69,6 @@ order: 73
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
```
|
||||
|
||||
## 属性表
|
||||
|
@ -85,7 +85,6 @@ import Tab3Schema from './Tabs/Tab3';
|
||||
import TestComponent from './Test';
|
||||
import APP from './APP/index';
|
||||
import {normalizeLink} from '../../src/utils/normalizeLink';
|
||||
import './WebComponent';
|
||||
|
||||
export const examples = [
|
||||
{
|
||||
|
@ -1,29 +0,0 @@
|
||||
/**
|
||||
* web component 的示例
|
||||
*/
|
||||
|
||||
import '@webcomponents/webcomponentsjs/custom-elements-es5-adapter';
|
||||
|
||||
class RandomNumber extends HTMLElement {
|
||||
connectedCallback() {
|
||||
const prefix = this.getAttribute('prefix') || '';
|
||||
const shadow = this.attachShadow({mode: 'open'});
|
||||
const text = document.createElement('span');
|
||||
text.textContent = `${prefix}: ${Math.floor(Math.random() * 1000)}`;
|
||||
shadow.appendChild(text);
|
||||
setInterval(function () {
|
||||
const count = `${prefix}: ${Math.floor(Math.random() * 1000)}`;
|
||||
text.textContent = count;
|
||||
}, 2000);
|
||||
}
|
||||
}
|
||||
|
||||
class WebContainer extends HTMLElement {
|
||||
connectedCallback() {
|
||||
const shadow = this.attachShadow({mode: 'open'});
|
||||
shadow.innerHTML = 'web-container';
|
||||
}
|
||||
}
|
||||
|
||||
customElements.define('random-number', RandomNumber);
|
||||
customElements.define('web-container', WebContainer);
|
71
fis-conf.js
71
fis-conf.js
@ -784,19 +784,72 @@ if (fis.project.currentMedia() === 'publish') {
|
||||
'!jquery/**',
|
||||
'!zrender/**',
|
||||
'!echarts/**',
|
||||
'!echarts-stat/**',
|
||||
'!papaparse/**',
|
||||
'!exceljs/**'
|
||||
'!exceljs/**',
|
||||
'!docsearch.js/**',
|
||||
'!monaco-editor/**.css',
|
||||
'!src/components/RichText.tsx',
|
||||
'!src/components/Tinymce.tsx',
|
||||
'!src/components/ColorPicker.tsx',
|
||||
'!react-color/**',
|
||||
'!material-colors/**',
|
||||
'!reactcss/**',
|
||||
'!tinycolor2/**',
|
||||
'!cropperjs/**',
|
||||
'!react-cropper/**',
|
||||
'!src/lib/renderers/Form/CityDB.js',
|
||||
'!src/components/Markdown.tsx',
|
||||
'!src/utils/markdown.ts',
|
||||
'!highlight.js/**',
|
||||
'!entities/**',
|
||||
'!linkify-it/**',
|
||||
'!mdurl/**',
|
||||
'!uc.micro/**',
|
||||
'!markdown-it/**',
|
||||
'!markdown-it-html5-media/**',
|
||||
'!punycode/**'
|
||||
],
|
||||
|
||||
'pkg/rich-text.js': [
|
||||
'src/components/RichText.js',
|
||||
'froala-editor/**',
|
||||
'jquery/**'
|
||||
],
|
||||
|
||||
'pkg/tinymce.js': ['src/components/Tinymce.tsx', 'tinymce/**'],
|
||||
'pkg/charts.js': ['zrender/**', 'echarts/**'],
|
||||
|
||||
'pkg/papaparse.js': ['papaparse/**'],
|
||||
|
||||
'pkg/exceljs.js': ['exceljs/**'],
|
||||
|
||||
'pkg/markdown.js': [
|
||||
'src/components/Markdown.tsx',
|
||||
'src/utils/markdown.ts',
|
||||
'highlight.js/**',
|
||||
'entities/**',
|
||||
'linkify-it/**',
|
||||
'mdurl/**',
|
||||
'uc.micro/**',
|
||||
'markdown-it/**',
|
||||
'markdown-it-html5-media/**',
|
||||
'punycode/**'
|
||||
],
|
||||
|
||||
'pkg/color-picker.js': [
|
||||
'src/components/ColorPicker.tsx',
|
||||
'react-color/**',
|
||||
'material-colors/**',
|
||||
'reactcss/**',
|
||||
'tinycolor2/**'
|
||||
],
|
||||
|
||||
'pkg/cropperjs.js': ['cropperjs/**', 'react-cropper/**'],
|
||||
|
||||
'pkg/charts.js': ['zrender/**', 'echarts/**', 'echarts-stat/**'],
|
||||
|
||||
'pkg/api-mock.js': ['mock/*.ts'],
|
||||
|
||||
'pkg/app.js': [
|
||||
'/examples/components/App.tsx',
|
||||
'/examples/components/App.tsx:deps'
|
||||
@ -810,17 +863,25 @@ if (fis.project.currentMedia() === 'publish') {
|
||||
|
||||
'pkg/rest.js': [
|
||||
'**.{js,jsx,ts,tsx}',
|
||||
'!static/mod.js',
|
||||
'!monaco-editor/**',
|
||||
'!mpegts.js/**',
|
||||
'!hls.js/**',
|
||||
'!froala-editor/**',
|
||||
'!src/components/RichText.tsx',
|
||||
'!jquery/**',
|
||||
'!src/components/RichText.js',
|
||||
'!zrender/**',
|
||||
'!echarts/**',
|
||||
'!papaparse/**',
|
||||
'!exceljs/**'
|
||||
'!exceljs/**',
|
||||
'!src/utils/markdown.ts',
|
||||
'!highlight.js/**',
|
||||
'!argparse/**',
|
||||
'!entities/**',
|
||||
'!linkify-it/**',
|
||||
'!mdurl/**',
|
||||
'!uc.micro/**',
|
||||
'!markdown-it/**',
|
||||
'!markdown-it-html5-media/**'
|
||||
],
|
||||
|
||||
'pkg/npm.css': ['node_modules/*/**.css', '!monaco-editor/**'],
|
||||
|
@ -118,7 +118,6 @@
|
||||
"@types/react-transition-group": "^2.0.6",
|
||||
"@types/sortablejs": "^1.3.32",
|
||||
"@types/tinymce": "^4.5.24",
|
||||
"@webcomponents/webcomponentsjs": "^2.6.0",
|
||||
"axios": "0.21.1",
|
||||
"bce-sdk-js": "^0.2.9",
|
||||
"concurrently": "^6.2.1",
|
||||
|
Loading…
Reference in New Issue
Block a user