value not being replaced in map containing function

huangapple go评论63阅读模式
英文:

value not being replaced in map containing function

问题

我正在尝试获取替换后的item.path值并在控制台日志中输出 - 该代码在Chrome开发工具中运行正常。

const cars = [{name: "Saab", type: "car" }, {name: "Volvo", type: "car" }, {name: "BMW", type: "car"}];

const dataTest = cars.map(item => {
  const renderData = {}

  renderData[item.name] = {
    render: (value) => { 
        myFunction(value, item.type)
      },
  }
   
  console.log('Item', item.type); // 这将返回正确的值"car"
  return renderData;
})

console.log('Data Test', dataTest);

从上面代码的Data Test中返回的数组列表,由于某种原因未替换路径。我尝试使用大括号(即myFunction(value, ${item.path})),但这只会更改下面的输出并在大括号中显示,而不是从数组中获取item.path并替换它,我无法弄清楚原因。

从上述代码的输出中,您会看到它是item.type,而不是"car"作为类型。有什么想法我可能做错了吗?

英文:

I am trying to get the value item.path replaced and outputted in console log - code works in chrome dev tools.

<!-- begin snippet: js hide: false console: true babel: false -->

<!-- language: lang-js -->

const cars = [{name: &quot;Saab&quot;, type: &quot;car&quot; }, {name: &quot;Volvo&quot;, type: &quot;car&quot; }, {name: &quot;BMW&quot;, type: &quot;car&quot;}];

const dataTest = cars.map(item =&gt; {
  const renderData = {}

  renderData[item.name] = {
    render: (value) =&gt; { 
        myFunction(value, item.type)
      },
  }
   
  console.log(&#39;Item&#39;, item.type); // This comes back with correct value car
  return renderData;
})

console.log(&#39;Data Test&#39;, dataTest);

<!-- end snippet -->

List of array coming back from Data Test - console log from above, for some reason its not replacing the path, I have tried with braces (i.e. myFunction(value, ${item.path})) but that just changes the output below with braces, its not getting item.path from the array and replacing it, can't figure out why

Output from above code, you will see its item.type and not coming bar with car as the type:

Saab
: 
render
: 
value =&gt; { myFunction(value, item.type); }

Any ideas what I could be doing wrong?

答案1

得分: 0

不确定为什么您期望替换 item.type 在输出中,但它可能按您想要的方式工作...

如果我添加一个简单的 myFunction,具有正确的签名,它将记录出 item.type 的正确值...

    const cars = [
      {name: "Saab", type: "car1" }, 
      {name: "Volvo", type: "car2" }, 
      {name: "BMW", type: "car3"}
    ];

    const dataTest = cars.map(item => {
      const renderData = {}

      renderData[item.name] = {
        render: (value) => { 
            myFunction(value, item.type)
          },
      }
      return renderData;
    })

    function myFunction(v, t) {
      console.log(`v: ${v}    t: ${t}`);
    }

    dataTest[0].Saab.render("foo");
    dataTest[1].Volvo.render("bar");
    dataTest[2].BMW.render("baz");
英文:

Not sure why you are expecting item.type to be replaced in the output, but it's probably working the way you want it...

Ie if I add a simple myFunction with the correct signature, it will log out the correct value of item.type ...

<!-- begin snippet: js hide: false console: true babel: false -->

<!-- language: lang-js -->

const cars = [
  {name: &quot;Saab&quot;, type: &quot;car1&quot; }, 
  {name: &quot;Volvo&quot;, type: &quot;car2&quot; }, 
  {name: &quot;BMW&quot;, type: &quot;car3&quot;}
];

const dataTest = cars.map(item =&gt; {
  const renderData = {}

  renderData[item.name] = {
    render: (value) =&gt; { 
        myFunction(value, item.type)
      },
  }
  return renderData;
})

function myFunction(v, t) {
  console.log(`v: ${v}    t: ${t}`);
}

dataTest[0].Saab.render(&quot;foo&quot;);
dataTest[1].Volvo.render(&quot;bar&quot;);
dataTest[2].BMW.render(&quot;baz&quot;);

<!-- end snippet -->

答案2

得分: -2

I might have resolved it, required back ticks for the value

render: 
`(value) =&gt; { 
        myFunction(value, ${item.type})
 }`
英文:

Think i might have resolved it, required back ticks for the value

render: 
`(value) =&gt; { 
        myFunction(value, ${item.type})
 }`

huangapple
  • 本文由 发表于 2023年5月26日 14:56:39
  • 转载请务必保留本文链接:https://go.coder-hub.com/76338320.html
匿名

发表评论

匿名网友

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen:

确定