Question

我正在尝试将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道具得到更新时出现问题，嵌入对象链接未得到更新，我不确定为什么。我尝试了不同的解决方案，例如动态构建嵌入对象并将其插入DOM，但这根本不起作用……甚至在初始加载时也是如此。

关于如何获取嵌入对象URL进行适当刷新的任何想法？

具有Tableau嵌入对象的VueJs组件未刷新

0 个答案: