提交 970b6830 编写于 作者: D DCloud_LXH

fix(ssr): canvas、webview

上级 6573b1f1
<template>
<text v-if="item">{{ item.title }}</text>
<!-- <text v-if="item">{{ item.title }}</text>
<text v-else>...</text>
<ssr-cover-image />
<ssr-cover-view />
<ssr-icon />
<ssr-image />
<ssr-image /> -->
<!-- <ssr-match-media /> -->
<!-- <ssr-movable-area /> -->
<ssr-progress />
<!-- <ssr-progress />
<ssr-scroll-view />
<ssr-swiper />
<ssr-text />
......@@ -23,7 +23,7 @@
<ssr-slider />
<ssr-map />
<ssr-picker-view />
<ssr-picker />
<ssr-picker /> -->
<ssr-webview />
<!-- <ssr-video /> dataOptions is not a function -->
......
......@@ -19,7 +19,9 @@ import { useNativeEvent, NativeEventTrigger } from '../../helpers/useEvent'
import { pixelRatio, wrapper, initHidpi } from '../../helpers/hidpi'
import { once } from '@dcloudio/uni-shared'
const initHidpiOnce = /*#__PURE__*/ once(initHidpi)
const initHidpiOnce = /*#__PURE__*/ once(() => {
return __NODE_JS__ ? onMounted(initHidpi) : initHidpi()
})
function $getRealPath(src: string) {
return src ? getRealPath(src) : src
......
import { ref, onMounted, Ref, onActivated, onDeactivated, Teleport } from 'vue'
import {
ref,
onMounted,
Ref,
onActivated,
onDeactivated,
watchEffect,
onBeforeUnmount,
} from 'vue'
import {
defineBuiltInComponent,
ResizeSensor,
......@@ -25,15 +33,34 @@ export default /*#__PURE__*/ defineBuiltInComponent({
inheritAttrs: false,
name: 'WebView',
props,
setup(props, { attrs }) {
setup(props) {
Invoke()
const rootRef: RootRef = ref(null)
const iframeRef: RootRef = ref(null)
const _resize = useWebViewSize(rootRef, iframeRef)
const { $attrs, $excludeAttrs, $listeners } = useAttrs({
excludeListeners: true,
})
let _resize: Function
const renderIframe = () => {
const iframe = document.createElement('iframe')
watchEffect(() => {
for (const key in $attrs.value) {
if (Object.prototype.hasOwnProperty.call($attrs.value, key)) {
const attr = ($attrs.value as any)[key]
;(iframe as any)[key] = attr
}
}
})
watchEffect(() => {
iframe.src = getRealPath(props.src)
})
document.body.appendChild(iframe)
iframeRef.value = iframe
_resize = useWebViewSize(rootRef, iframeRef)
}
__NODE_JS__ ? onMounted(renderIframe) : renderIframe()
onMounted(() => {
_resize()
})
......@@ -46,6 +73,10 @@ export default /*#__PURE__*/ defineBuiltInComponent({
iframeRef.value && (iframeRef.value.style.display = 'none')
})
onBeforeUnmount(() => {
document.body.removeChild(iframeRef.value!)
})
return () => {
return (
<>
......@@ -58,13 +89,14 @@ export default /*#__PURE__*/ defineBuiltInComponent({
<ResizeSensor onResize={_resize} />
</uni-web-view>
<Teleport to="body">
{/* TODO 等待teleport组件支持ssr */}
{/* <Teleport to="body">
<iframe
ref={iframeRef}
src={getRealPath(props.src)}
{...$attrs.value}
></iframe>
</Teleport>
</Teleport> */}
</>
)
}
......
Markdown is supported
0% .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑!
想要评论请 注册