linktoDestination 不适用于 pdfmake

问题描述 投票:0回答:1

目前我正在使用pdfmake将html转换为pdf,这是我第一次使用它。

我正在尝试将 Ashish、twitter、aaa 链接到他们的特定部分。 我尝试在 playground 上运行以下代码,但仅限 aaa 导航到该部分。

// playground requires you to assign document definition to a variable called dd

var dd = {
    content: [
    {
        "columns": [
            {
                "text": "",
                "priority": 0
            },
            {
                "stack": [
                    "2/17/2021, 2:41:01 PM",
                    {
                        "text": "AshishTemplate v4"
                    }
                ],
                "style": {
                    "alignment": "right"
                },
                "priority": 1
            }
        ]
    },
    {
        "text": "\n Table of Contents \n\n",
        "style": "header"
    },
    {
        "columns": [
            {
                "text": "Ashish",
                "width": "auto",
                "style": "tableOfContents",
                "linkToDestination": "Ashish1"
            },
            {
                "text": "Twitter",
                "width": "auto",
                "style": "tableOfContents",
                "linkToDestination": "Twitter1"
            },
            {
                "text": "aaa",
                "width": "auto",
                "style": "tableOfContents",
                "linkToDestination": "aaa"
            }
        ],
        "columnGap": 10
    },
    {
        "text": "Ashish",
        "style": "sectionHeader",
        "id": "Ashish1"
    },
    "",
    {
        "columns": [
            {
                "width": "100%",
                "text": ""
            }
        ]
    },
    {
        "text": "Twitter",
        "style": "sectionHeader",
        "id": "Twitter1"
    },
    "AShish",
    {
        "columns": [
            {
                "style": "listViewTable",
                "table": {
                    "widths": [
                        "50%",
                        "50%"
                    ],
                    "body": [
                        [
                            "Address",
                            "-"
                        ],
                        
                    ]
                },
                "layout": {
                    "defaultBorder": false
                }
            }
        ]
    },
    {
        "text": "aaa",
        "style": "sectionHeader",
        "id": "aaa"
    },
    "aa",
    {
        "columns": [
            {
                "width": "100%",
                "stack": []
            }
        ]
    }
]
}

我错过了什么? Ashish 和 Twitter 不应该有一个指向他们特定部分的链接吗? 我想要的目录输出如下:

阿什什推特aaa

每当用户将鼠标悬停在文本上时,用户应该能够单击它并导航到该部分。

javascript html-to-pdf pdfmake
1个回答
0
投票

我知道这对您来说已经很晚了,但希望它对遇到此问题的其他人有所帮助: 您需要使用

id
设置目的地 例如 如果您的原籍是:

{
text: "Twitter",
width: "auto",
style: "tableOfContents",
linkToDestination: "Twitter1"
},

您的目的地应该是:

{
text: "which ever element that you need"
id: Twitter1

此解决方案也适用于 Chrome

** 更新 **

有些链接无法使用。使用

.toLowerCase()
解决问题

© www.soinside.com 2019 - 2024. All rights reserved.