Commit e9a009b

authored

Merge pull request #1 from bsrsnlbyrk/master

default embed code added for useEmbed example

2 parents ea58abc + 265709b commit e9a009bCopy full SHA for e9a009b

File tree

+25

-9

lines changed

+25

-9

lines changed

Lines changed: 12 additions & 5 deletions

Original file line number	Diff line number	Diff line change
`@@ -1,14 +1,21 @@`
`1`	`1`	`<script setup lang="ts">`
`2`		`-import { ref } from 'vue';`
`3`		`-import { useEmbed } from 'vue3-use-hooks';`
`4`		`-const code = ref(null);`
	`2`	`+import { ref } from "vue";`
	`3`	`+import { useEmbed } from "vue3-use-hooks";`
	`4`	`+import exampleEmbed from "../shared/exampleEmbed";`
	`5`	`+`
	`6`	`+const code = ref(exampleEmbed);`
`5`	`7`	`const { isEmbedBlock, clear } = useEmbed(code);`
`6`	`8`	`</script>`
`7`	`9`
`8`	`10`	`<template>`
`9`	`11`	`<div class="example-container">`
`10`	`12`	`<div class="flex-container">`
`11`		`- <textarea rows="5" cols="50" placeholder="Place embed code here" v-model="code"></textarea>`
	`13`	`+ <textarea`
	`14`	`+ rows="5"`
	`15`	`+ cols="50"`
	`16`	`+ placeholder="Place embed code here"`
	`17`	`+ v-model="code"`
	`18`	`+ ></textarea>`
`12`	`19`	`<button type="button" class="clear-button" @click="clear">Clear</button>`
`13`	`20`	`</div>`
`14`	`21`	`<div v-if="isEmbedBlock" v-html="code" class="embed-block"></div>`
`@@ -52,4 +59,4 @@ $white: #fff;`
`52`	`59`	`margin-bottom: 2em;`
`53`	`60`	`}`
`54`	`61`	`}`
`55`		`-</style>`
	`62`	`+</style>`

Lines changed: 4 additions & 0 deletions

Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

Lines changed: 9 additions & 4 deletions

Original file line number	Diff line number	Diff line change
`@@ -1,4 +1,4 @@`
`1`		`-import { ref, computed, watch, Ref } from 'vue';`
	`1`	`+import { ref, computed, watch, Ref,onMounted } from 'vue';`
`2`	`2`
`3`	`3`	`declare global {`
`4`	`4`	`interface Window {`
`@@ -78,10 +78,15 @@ const useEmbed = (code: any = null) => {`
`78`	`78`	`injectedScripts.value = [];`
`79`	`79`	`};`
`80`	`80`
	`81`	`+ onMounted(() => {`
	`82`	`+ if (embedCode.value) {`
	`83`	`+ injectScript({ id: 'id', src: getEmbedScriptSrc(embedCode.value) });`
	`84`	`+ }`
	`85`	`+ })`
	`86`	`+`
`81`	`87`	`watch(code, newValue => {`
`82`	`88`	`if (newValue) {`
`83`		`- const src = getEmbedScriptSrc(newValue);`
`84`		`- injectScript({ id: 'id', src });`
	`89`	`+ injectScript({ id: 'id', src: getEmbedScriptSrc(newValue) });`
`85`	`90`	`}`
`86`	`91`	`});`
`87`	`92`
`@@ -91,4 +96,4 @@ const useEmbed = (code: any = null) => {`
`91`	`96`	`};`
`92`	`97`	`};`
`93`	`98`
`94`		`-export default useEmbed;`
	`99`	`+export default useEmbed;`

Comments

(0)