diff --git a/public/code/index.yml b/public/code/index.yml index e6b89aa..3691fb2 100644 --- a/public/code/index.yml +++ b/public/code/index.yml @@ -1,4 +1,5 @@ - hello-world.jsx +- vue-at-gh119.js - vue-at-element-2.x-input.js - vue-at-element-1.x-input.js - vue-threejs.js diff --git a/public/code/vue-at-gh119.js b/public/code/vue-at-gh119.js new file mode 100644 index 0000000..f6317a0 --- /dev/null +++ b/public/code/vue-at-gh119.js @@ -0,0 +1,49 @@ +// await loadJs('https://cdn.jsdelivr.net/npm/vue@2.6.11/dist/vue.min.js') +await loadJs('https://unpkg.com/vue@2.6.11/dist/vue.min.js') + +// await loadJs('https://unpkg.com/vue-at') +await loadJsForceUmd({ + url: 'https://unpkg.com/vue-at@2.5.0-beta.2/dist/vue-at.js', + name: 'VueAt', +}) + +appendCss(` +.container { padding: 20px } +.editor { margin-top:20px; padding:4px 8px; height:120px; border:solid 1px gray; white-space:pre-wrap } +.atwho-remove { cursor: pointer } +`) + +window.atwhoRemoveItem = target => { + let tag = target.parentNode.parentNode + tag.parentNode.removeChild(tag) +} + +let App = { + components: { At: VueAt }, + template: ` +
+ `, + data() { + return { + links: [ + 'https://github.com/fritx/vue-at', + 'https://github.com/fritx/vue-at/issues/119', + ], + members: [ + 'fritx', 'linguokang', 'huangruichang' + ], + input: ' [ @fritx × ] [ @huangruichang × ] ' + } + } +} diff --git a/public/code/vue-at-gh119.js.png b/public/code/vue-at-gh119.js.png new file mode 100644 index 0000000..50ddc0a Binary files /dev/null and b/public/code/vue-at-gh119.js.png differ diff --git a/public/code/vue-threejs.js b/public/code/vue-threejs.js index e9e6e97..50b625c 100644 --- a/public/code/vue-threejs.js +++ b/public/code/vue-threejs.js @@ -1,8 +1,8 @@ // await loadJs('https://cdn.jsdelivr.net/npm/vue@2.6.11/dist/vue.min.js') await loadJs('https://unpkg.com/vue@2.6.11/dist/vue.min.js') -// await loadJs('https://unpkg.com/three@0.115.0/build/three.min.js') -await loadJs('https://unpkg.com/three@0.81.2/build/three.min.js') +// await loadJs('https://unpkg.com/three@0.81.2/build/three.min.js') +await loadJs('https://unpkg.com/three@0.115.0/build/three.min.js') // await loadJs('https://unpkg.com/vue-threejs@0.2.0-alpha.1/lib/VueThreejs.umd.min.js') await loadJs('https://unpkg.com/vue-threejs@0.2.0-alpha.1/lib/VueThreejs.umd.js') @@ -42,9 +42,6 @@ let App = { } } }, - created() { - this.handleResize = _.debounce(this.handleResize, 2000) - }, mounted() { mountNode.addEventListener('resize', this.handleResize) }, @@ -56,8 +53,6 @@ let App = { this.ui.rotation.x += 0.01 this.ui.rotation.y += 0.01 }, - handleResize() { - triggerPreview() - } + handleResize: _.debounce(triggerPreview, 2000) } } diff --git a/src/playground/Playground.tsx b/src/playground/Playground.tsx index 64c5633..d151109 100644 --- a/src/playground/Playground.tsx +++ b/src/playground/Playground.tsx @@ -188,7 +188,7 @@ export let Playground: React.FC = () => { return (