xuyue/webpreview
1
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

add jQuery

Browse Source
This commit is contained in:
yuetsh
2025-02-24 19:57:00 +08:00
parent 7957a717e3
commit b3371676cb
4 changed files with 29 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

7
src/components/Editors.vue
View File

@@ -40,7 +40,7 @@
<span>选项</span>
</n-flex>
</template>
<n-flex vertical class="wrapper">
<n-flex size="large" vertical class="wrapper">
<n-flex align="center">
<span class="label">重置</span>
<n-button @click="reset('html')">HTML</n-button>
@@ -59,6 +59,11 @@
</n-button>
</n-flex>
</n-flex>
<n-flex align="center">
<span class="label">预加载</span>
<n-tag type="success">Normalize.css</n-tag>
<n-tag type="success">jQuery</n-tag>
</n-flex>
</n-flex>
</n-tab-pane>
</n-tabs>

19
src/components/Preview.vue
View File

@@ -1,7 +1,11 @@
<template>
<div>
<iframe class="iframe" ref="iframe"></iframe>
</div>
<n-flex align="center" justify="space-between" class="pane">
<n-text class="preview">预览</n-text>
<n-flex>
<n-button>提交</n-button>
</n-flex>
</n-flex>
<iframe class="iframe" ref="iframe"></iframe>
</template>
<script lang="ts" setup>
@@ -23,6 +27,7 @@ function preview() {
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<style>${css.value}</style>
<link rel="stylesheet" href="/normalize.min.css" />
<script src="/jquery.min.js"><\/script>
</head>
<body>
${html.value}
@@ -35,6 +40,14 @@ watchDebounced([html, css, js], preview, { debounce: 500, maxWait: 1000 })
onMounted(preview)
</script>
<style scoped>
.pane {
height: 46px;
background-color: rgb(247, 247, 250);
padding: 0 20px;
}
.preview {
font-size: 16px;
}
.iframe {
width: 100%;
height: 100%;