找回密码
 立即注册

QQ登录

只需一步,快速开始

红色的石头

注册会员

4

主题

5

帖子

21

积分

注册会员

积分
21
  • 89

    金币

  • 4

    主题

  • 5

    帖子

最新发帖
红色的石头
注册会员   /  发表于:2023-9-24 16:34  /   查看:2578  /  回复:4
1金币

<template>
    <div id="viewerContainer">
    </div>
</template>
<script>
    export default {
        props: ['reportName'],
        mounted() {
            this.viewer = new GrapeCity.ActiveReports.JSViewer.create({
                element: '#viewerContainer'
            });
        },
        watch: {
            reportName() {
                this.viewer.openReport(this.reportName);
            }
        },
    }
</script>

<style>
#viewerContainer {
    height: 100vh;
    float:center;
    width: calc(100% - 200pt);
}




如上:示例代码中的内容,请问this.reportName是什么值,如何获取? 有完整的集成代码吗?谢谢


最佳答案

查看完整内容

抱歉,您找的这个Demo应该是有问题的,这个项目引入的包是我们另一个产品的包。 也就是ARJS的产品: 所以这个是没办法初始化ActiveReport这个产品的。那个产品是一个纯前端的。所以不存在serviceUrl 所以这个项目肯定是有问题的。而如果您想初始化vue的项目,其实很简单,我们有AR专门用的包: "@grapecity/ar-designer", "@grapecity/ar-viewer", 这两个包才是给AR用的,里面有对应的js和css。 然后如何初始化呢,您 ...

4 个回复

倒序浏览
最佳答案
最佳答案
Felix.LiWyn认证
超级版主   /  发表于:2023-9-24 16:34:16
来自 5#
抱歉,您找的这个Demo应该是有问题的,这个项目引入的包是我们另一个产品的包。

也就是ARJS的产品:

所以这个是没办法初始化ActiveReport这个产品的。那个产品是一个纯前端的。所以不存在serviceUrl
所以这个项目肯定是有问题的。而如果您想初始化vue的项目,其实很简单,我们有AR专门用的包:
"@grapecity/ar-designer",
"@grapecity/ar-viewer",

这两个包才是给AR用的,里面有对应的js和css。
然后如何初始化呢,您这边跑一个我们的Demo项目。git上面随便跑一个服务端的项目即可:
然后您的vue项目做如下初始化:

这样就可以初始化一个了
vue代码如下:

本帖子中包含更多资源

您需要 登录 才可以下载或查看,没有帐号?立即注册

x
回复 使用道具 举报
wengMQ悬赏达人认证
银牌会员   /  发表于:2023-9-24 19:01:44
2#
可以加我QQ546962925
回复 使用道具 举报
Felix.LiWyn认证
超级版主   /  发表于:2023-9-25 10:13:07
3#
问题描述:

集成Demo代码示例:

问题解答,您好关于您的问题,可以参考这里:
https://github.com/activereports/WebSamples17
这是我们全部的示例代码
vue的可以参考这里:https://github.com/activereports ... s/JSViewer_Vue_Core

然后看您的截图,应该就是初始化正常加载报表,里面的reportName就是报表名称。这里的报表名称会传给后端,然后后端会根据名称去返回您配置的报表,所以这个reportName不是固定的,所以就用变量代替的
回复 使用道具 举报
红色的石头
注册会员   /  发表于:2023-9-25 15:10:39
4#
感谢回复,这是我从网上搜索到的在vue集成AR的例子,请问有和下面这个例子相似的官方文档和demo吗?在下面的例子中,我可以设置报表所在的URL地址、要展示的报表路径、报表参数等,但是上面的官方demo中,并没有可以设置参数的地方!
<template>
<div>
<ar-viewer :serviceUrl="serviceUrl" :reportPath="reportPath" :parameters="parameters" :culture="culture"></ar-viewer>
</div>
</template>
<script>
import { ArViewer } from "@grapecity/activereports-vue";
export default {
name: "MyComponent",
components: {
ArViewer
},
data() {
return {
serviceUrl: "http://myserver/myapp",
reportPath: "reports/myreport.rdlx",
parameters: [
{ name: "param1", value: "Hello" },
{ name: "param2", value: "World" }
],
culture: "en-US"
};
}
};
</script>
回复 使用道具 举报
您需要登录后才可以回帖 登录 | 立即注册
返回顶部