连接 AlpineJS x-text 和 HREF 的问题属性

Question

我有一个数据table table 由 AlpineJS 提供：

<template x-for = "user in users": key = "user.Id">

在 x-for 中，我可以使用指令 x-text:

在 SPAN 字段中列出 user.Id 的值

<span id = "user.Id" class = "text-gray-700 px-6 py-3 flex items-center" x-text = "user.Id"> </span>

我需要在我的 HREF 属性的末尾连接 user.Id 的值，这将调用后端的路由来停用记录：

直接，尝试设置HREF + user.Id 属性，没用，于是想了下：

<script>
   var uid = document.getElementById ("user.Id");
   console.log ('uid value:' + uid.InnerText);
   var link = document.getElementById ("link");
   link.setAttribute ('href', 'http://api-paulinhomonteiro-com.umbler.net/cli/delete/<%= token%> /' + uid.innertText)
</script>

通过动态设置属性效果很好，但变量到达时未定义。

我该如何解决这个问题？我刚刚发现了 AlpineJS，我不能再进一步了。有人可以帮助我吗？

Answer 1

要使用 Alpine 执行此操作，您需要使用 x-bind：

<span 
  id = "user.Id"
  x-bind:href="'http://api-paulinhomonteiro-com.umbler.net/cli/delete/' + user.Id"
  class = "text-gray-700 px-6 py-3 flex items-center" 
  x-text = "user.Id"> </span>

连接 AlpineJS x-text 和 HREF 的问题属性

Problem to concatenate AlpineJS x-text and HREF property

javascript

href

alpine.js

连接 AlpineJS x-text 和 HREF 的问题 属性

Problem to concatenate AlpineJS x-text and HREF property

javascript

href

alpine.js

连接 AlpineJS x-text 和 HREF 的问题属性