Я пытаюсь превратить Tableau Embed Code в компонент VueJS, и он отлично работает при начальной загрузке, то есть панель инструментов tableau отображается очень хорошо с кодом ниже:
<script>
export default {
name: 'TableauFrame',
props: {
link: {
type: String,
required: true
},
tabs: {
type: String,
default: "no"
}
},
mounted() {
let tableauScript = document.createElement('script')
tableauScript.setAttribute('src', 'https://myserver.com/javascripts/api/viz_v1.js')
document.head.appendChild(tableauScript)
}
}
</script>
<template>
<div class="viz">
</div>
<object class='tableauViz' id="tableauFrame" width='100%' height='850' style='display:none;'>
<param name='host_url' value='https://myserver.com/' />
<param name='embed_code_version' value='3' />
<param name='site_root' value='' />
<param name='name' :value='link' />
<param name='tabs' :value='tabs' />
<param name='toolbar' value='yes' />
<param name='showAppBanner' value='false' />
<param name='filter' value='iframeSizedToWindow=true' />
</object>
</template>
<style>
</style>
Проблема возникает, когда обновляется реквизит link
, ссылка на объект встраивания не обновляется, и я не уверен, почему. Я пробовал разные решения, такие как динамическое построение объекта embed и вставка в DOM, но это не работает вообще ... даже при начальной загрузке.
Есть идеи, как получить URL-адрес для встраиваемого объекта для соответствующего обновления?