在反应中使用pdfmake的动态pdf答案

【问题标题】：dynamic pdf using pdfmake in react在反应中使用pdfmake的动态pdf
【发布时间】：2020-08-07 09:11:54
【问题描述】：

我尝试在 reactjs 中使用 pdfMake 制作动态 pdf。我能够从静态数据生成 pdf。为了使其动态化，我制作了一个函数，该函数采用参数来进一步设置 pdfMake 对象的变量。但是，当我访问对象时，对象没有更新。

pdfMake 对象和函数的示例代码（示例对象未满）

import { logo} from './pdf-logo';
var receipt_number=null;
var date_issued=null;
var status=null;

export const setDefinition=(id,created_date,invoice_status)=>
{
  receipt_number=id;
  date_issued=created_date;
  status=invoice_status;
  return dd;
}


var  dd = {
  content: [
    {
      columns: [
        {
          image: logo,
          width: 150,
        },
        [
          {
            text: 'Receipt',
            color: '#333333',
            width: '*',
            fontSize: 28,
            bold: true,
            alignment: 'right',
            margin: [0, 0, 0, 15],
          },
          {
            stack: [
              {
                columns: [
                  {
                    text: 'Receipt No.',
                    color: '#aaaaab',
                    bold: true,
                    width: '*',
                    fontSize: 12,
                    alignment: 'right',
                  },
                  {
                    text: receipt_number, //vaiable used
                    bold: true,
                    color: '#333333',
                    fontSize: 12,
                    alignment: 'right',
                    width: 100,
                  },
                ],
              },
              {
                columns: [
                  {
                    text: 'Date Issued',
                    color: '#aaaaab',
                    bold: true,
                    width: '*',
                    fontSize: 12,
                    alignment: 'right',
                  },
                  {
                    text: date_issued, //variable used
                    bold: true,
                    color: '#333333',
                    fontSize: 12,
                    alignment: 'right',
                    width: 100,
                  },
                ],
              },
              {
                columns: [
                  {
                    text: 'Status',
                    color: '#aaaaab',
                    bold: true,
                    fontSize: 12,
                    alignment: 'right',
                    width: '*',
                  },
                  {
                    text: status, //vaiable used
                    bold: true,
                    fontSize: 14,
                    alignment: 'right',
                    color: 'green',
                    width: 100,
                  },
                ],
              },
            ],
          },
        ],
      ],
    }
};

我在我的发票组件中导入 setDefinition 函数并使用一些值调用它。例如。


let obj=setDefinition('123345','10 July 2020','Paid');
cosole.log(obj)//not getting the updated object

【问题讨论】：

标签： javascript reactjs typescript pdfmake

【解决方案1】：

我找到了一种使 dd 对象动态化的方法。我们必须将 dd 对象分解为更小的对象，然后更新更小的对象的值。

例如：


function update=(value){
logo.width=value;
return dd;
}

var logo={
width:'50'
}

var dd={
logo
}

【讨论】：