与Vue集成中如何实现报表传参

收藏

Vue框架是目前前端使用频率最高的框架，因此常有用户需要将Vue与ARJS 框架集成来实现整个系统的展示功能。
ActiveReportsJS 支持与前端框架Vue,Angular,Pure,React集成，那本篇文章主要介绍如何与Vue框架集成，并传递报表参数值。

vue create arjs-vue -d

cd arjs-vue

npm install @grapecity/activereports-vue

或

yarn add @grapecity/activereports-vue

template>
<div>
<input type="text" id="userName" value="1">
<div id="reportview" style="height: 800px" />
</div>
</template>
<script>
import '@grapecity/activereports/styles/ar-js-viewer.css';
import {Viewer} from '@grapecity/activereports/viewer';
export default {
name: 'app',
mounted(){
var getValue=document.getElementById("userName").value;
this.viewer = new Viewer('#reportview');
this.viewer.open('../TestReport.rdlx-json',{ ReportParams: [{ Name: 'ReportParameter1', Value: [getValue] }] });
}
}

复制代码

		自动登录	找回密码
密码			立即注册

0 个回复