vue(内嵌tableau server报表)_vue 嵌入 tableau

0.引入Tableau-2.4.0.min.js到/public下

1.在package.json中引入tableau-api-js安装包
“tableau-api-js”: “^2.6.1”

2.在main.js中全局引入
import * as Tableau from ‘tableau-api-js’
Vue.prototype.$tableau = Tableau

3.调用后端接口 Api\app.js
export function getTableauTrustedUrl(params) {
return request({
url: ‘/tableau/getTableauTrustedUrl’,
method: ‘get’,
params
})
}

4.编写tableau视图组件：tableauViz.vue
实现加水印，获取票证得到授权访问相关报表，渲染tableau报表

5.具体使用：Report\index.vue
import TableauViz from ‘./TableauViz’
components: {
TableauViz,
ToolBar,
SearchReport
},

// 使用组件
<tableau-viz
v-if=“getTitleByID(tId)!=CATALOGUE_NAME”
v-show=“activePage===tId”
:active-id=“tId”
:menu-name=“getTitleByID(tId)”
@success=“success”
/>