Laravel一对多关系值的获取传递及JavaScript使用问题

首先来说你遇到的第一个问题：为什么数组只拿到最后一个值？

看你这段Controller代码：

$payments = array(); 
$pays = User::find($userid); 
foreach ($pays->payments as $pay) { 
    $payments = $pay->payment; 
}

问题出在$payments = $pay->payment;这一行——每次循环你都把$payments变量直接覆盖成当前的$pay->payment值，而不是把值追加到数组里。所以循环结束后，$payments自然只剩下最后一次循环的那个值。

修复数组赋值的两种方法 #

1. 手动追加到数组：把赋值语句改成数组追加的形式，这样每次循环都会把新值加入数组：

$payments = array(); 
$pays = User::find($userid); 
foreach ($pays->payments as $pay) { 
    $payments[] = $pay->payment; // 用[]语法追加元素
}

2. 用Laravel集合的pluck方法（更简洁）：既然$pays->payments是Eloquent集合，你可以直接用pluck提取指定字段，再转成数组，省去手动循环：

$payments = User::find($userid)->payments->pluck('payment')->toArray();

接下来是第二个问题：把这个数组传递到Blade模板，并在JavaScript中使用。

这里有两种常用且安全的方法：

方法一：直接在Blade中用@json指令转成JSON #

Laravel的Blade内置了@json指令，可以安全地把PHP数组转成JSON格式，直接赋值给JS变量：

<script>
// 把PHP数组直接转为JS数组
const payments = @json($payments);

// 现在你可以在JS里正常操作这个数组了
console.log(payments); // 输出：[18000, 19000, 9000]
</script>

@json会自动处理转义问题，不用担心特殊字符或者XSS风险。

方法二：通过HTML的data-*属性传递 #

如果你不想直接在script标签里写PHP变量，可以把数据存在HTML元素的自定义data属性中，再用JS读取：

<!-- 在Blade模板的某个元素上存储数据 -->
<div id="payment-wrapper" data-payments="@json($payments)"></div>

<script>
// 获取存储数据的DOM元素
const wrapper = document.getElementById('payment-wrapper');
// 读取data属性并解析成JS数组
const payments = JSON.parse(wrapper.dataset.payments);

// 同样可以正常使用数组
console.log(payments);
</script>

这种方法适合需要把数据和特定DOM元素绑定的场景。

这样修改后，你就能正确获取所有payment值，并且顺利在JavaScript中使用啦！

内容的提问来源于stack exchange，提问作者Shoaib Akhtar