我无法确定 Alpine JS 中出现此消息的原因
I cannot identify the reason for this message in Alpine JS
我收到此错误并且不知道如何解决:
alpine.js:115 Alpine Error: "ReferenceError: Invalid left-hand side in assignment"
Expression: "getTasks() = rightSideOfExpression($event, getTasks())"
Element: <input class="shadow appearance-none border rounded w-1/3 py-2 px-2 my-1 mx-1 text-gray-700 leading-tight focus:outline-none focus:shadow-outline" id="valorvenda" type="text" placeholder="Valor" autofocus x-ref="valorvenda" @keydown.enter="addTask($refs.valorvenda.id)">
u @ alpine.js:115
(anonymous) @ alpine.js:132
<input class="shadow appearance-none border rounded w-1/3 py-2 px-2 my-1 mx-1 text-gray-700 leading-tight focus:outline-none focus:shadow-outline" id="valorvenda" type="text" placeholder="Valor" autofocus="" x-ref="valorvenda" @keydown.enter="addTask($refs.valorvenda.id)">
VM5454749:3 Uncaught (in promise) ReferenceError: Invalid left-hand side in assignment
at eval (eval at d.el (alpine.js:174), <anonymous>:3:21)
at d.el (alpine.js:174)
at d (alpine.js:131)
at alpine.js:151
at be.evaluateCommandExpression (alpine.js:1760)
at z (alpine.js:933)
at HTMLDivElement.l (alpine.js:909)
并且不知道我在做什么!你能帮帮我吗?
您可能是想比较而不是赋值。将 =
更改为 ==
:
getTasks() == rightSideOfExpression($event, getTasks())
我整个周末都在寻找这个问题。
我相信原因是因为我正在使用这样的 x-model 属性:
<div x-data="tasks()" x-init="getTasks()" x-model="getTasks()">
<div class="grid grid-cols-1 sm:grid-cols-1 md:grid-cols-2 lg:grid-cols-2">
<div class="card m-1 p-1 cursor-pointer border border-gray-400 rounded-lg hover:shadow-md hover:border-opacity-0 transform hover:-translate-y-1 transition-all duration-200">
<div class="flex flex-row w-full py-2 px-2 m-1 text-sm text-green-800 bg-green-100">
Definir estratégia de COMPRA:
<input class="shadow appearance-none border rounded w-1/3 py-2 px-2 my-1 mx-1 text-gray-700 leading-tight focus:outline-none focus:shadow-outline" id="valorcompra" type="text" placeholder="Valor" autofocus x-ref="valorcompra" @keydown.enter="addTask($refs.valorcompra.id)">
<input class="shadow appearance-none border rounded w-1/3 py-2 px-2 my-1 mx-1 text-gray-700 leading-tight focus:outline-none focus:shadow-outline" id="percentualcompra" type="text" placeholder="Percentual">
<input class="shadow appearance-none border rounded w-1/3 py-2 px-2 my-1 mx-1 text-gray-700 leading-tight focus:outline-none focus:shadow-outline" id="quantidadecompra" type="text" placeholder="Quantidade">
</div>
<template x-for="(t, taskIndex) in tasks.filter(t => t.coin === window.moeda && t.boardName === 'compra')" :key="taskIndex">
<div :id="t.uuid">
<div class="bg-white rounded-lg shadow mb-3 p-2 text-sm">
<div x-text="t.name" class="text-gray-800"></div>
<div class="grid grid-cols-1 sm:grid-cols-1 md:grid-cols-2 lg:grid-cols-2">
<div x-text="formatDateDisplay(t.date)" class="text-gray-500 text-xs"></div>
<div class="items-start text-right text-red-800" @click="removeTask(t.uuid)"><i class="fa fa-times-circle" aria-hidden="true"></i></div>
</div>
</div>
</div>
</template>
</div>
<div class="card m-1 p-1 cursor-pointer border border-gray-400 rounded-lg hover:shadow-md hover:border-opacity-0 transform hover:-translate-y-1 transition-all duration-200">
<div class="flex flex-row w-full py-2 px-2 m-1 text-sm text-red-800 bg-red-100">
Definir estratégia de VENDA:
<input class="shadow appearance-none border rounded w-1/3 py-2 px-2 my-1 mx-1 text-gray-700 leading-tight focus:outline-none focus:shadow-outline" id="valorvenda" type="text" placeholder="Valor" autofocus x-ref="valorvenda" @keydown.enter="addTask($refs.valorvenda.id)">
<input class="shadow appearance-none border rounded w-1/3 py-2 px-2 my-1 mx-1 text-gray-700 leading-tight focus:outline-none focus:shadow-outline" id="percentualvenda" type="text" placeholder="Percentual">
<input class="shadow appearance-none border rounded w-1/3 py-2 px-2 my-1 mx-1 text-gray-700 leading-tight focus:outline-none focus:shadow-outline" id="quantidadevenda" type="text" placeholder="Quantidade">
</div>
<template x-for="(t, taskIndex) in tasks.filter(t => t.coin === window.moeda && t.boardName === 'venda')" :key="taskIndex">
<div :id="t.uuid">
<div class="bg-white rounded-lg shadow mb-3 p-2 text-sm">
<div x-text="t.name" class="text-gray-800"></div>
<div class="grid grid-cols-1 sm:grid-cols-1 md:grid-cols-2 lg:grid-cols-2">
<div x-text="formatDateDisplay(t.date)" class="text-gray-500 text-xs"></div>
<div class="items-start text-right text-red-800" @click="removeTask(t.uuid)"><i class="fa fa-times-circle" aria-hidden="true"></i></div>
</div>
</div>
</div>
</template>
</div>
</div>
</div>
这里赋值一个JS函数是错误的原因。我需要的是每次 getTasks() 函数 运行 时更新 x 数据的方法,我不知道该怎么做。
我收到此错误并且不知道如何解决:
alpine.js:115 Alpine Error: "ReferenceError: Invalid left-hand side in assignment"
Expression: "getTasks() = rightSideOfExpression($event, getTasks())"
Element: <input class="shadow appearance-none border rounded w-1/3 py-2 px-2 my-1 mx-1 text-gray-700 leading-tight focus:outline-none focus:shadow-outline" id="valorvenda" type="text" placeholder="Valor" autofocus x-ref="valorvenda" @keydown.enter="addTask($refs.valorvenda.id)">
u @ alpine.js:115
(anonymous) @ alpine.js:132
<input class="shadow appearance-none border rounded w-1/3 py-2 px-2 my-1 mx-1 text-gray-700 leading-tight focus:outline-none focus:shadow-outline" id="valorvenda" type="text" placeholder="Valor" autofocus="" x-ref="valorvenda" @keydown.enter="addTask($refs.valorvenda.id)">
VM5454749:3 Uncaught (in promise) ReferenceError: Invalid left-hand side in assignment
at eval (eval at d.el (alpine.js:174), <anonymous>:3:21)
at d.el (alpine.js:174)
at d (alpine.js:131)
at alpine.js:151
at be.evaluateCommandExpression (alpine.js:1760)
at z (alpine.js:933)
at HTMLDivElement.l (alpine.js:909)
并且不知道我在做什么!你能帮帮我吗?
您可能是想比较而不是赋值。将 =
更改为 ==
:
getTasks() == rightSideOfExpression($event, getTasks())
我整个周末都在寻找这个问题。 我相信原因是因为我正在使用这样的 x-model 属性:
<div x-data="tasks()" x-init="getTasks()" x-model="getTasks()">
<div class="grid grid-cols-1 sm:grid-cols-1 md:grid-cols-2 lg:grid-cols-2">
<div class="card m-1 p-1 cursor-pointer border border-gray-400 rounded-lg hover:shadow-md hover:border-opacity-0 transform hover:-translate-y-1 transition-all duration-200">
<div class="flex flex-row w-full py-2 px-2 m-1 text-sm text-green-800 bg-green-100">
Definir estratégia de COMPRA:
<input class="shadow appearance-none border rounded w-1/3 py-2 px-2 my-1 mx-1 text-gray-700 leading-tight focus:outline-none focus:shadow-outline" id="valorcompra" type="text" placeholder="Valor" autofocus x-ref="valorcompra" @keydown.enter="addTask($refs.valorcompra.id)">
<input class="shadow appearance-none border rounded w-1/3 py-2 px-2 my-1 mx-1 text-gray-700 leading-tight focus:outline-none focus:shadow-outline" id="percentualcompra" type="text" placeholder="Percentual">
<input class="shadow appearance-none border rounded w-1/3 py-2 px-2 my-1 mx-1 text-gray-700 leading-tight focus:outline-none focus:shadow-outline" id="quantidadecompra" type="text" placeholder="Quantidade">
</div>
<template x-for="(t, taskIndex) in tasks.filter(t => t.coin === window.moeda && t.boardName === 'compra')" :key="taskIndex">
<div :id="t.uuid">
<div class="bg-white rounded-lg shadow mb-3 p-2 text-sm">
<div x-text="t.name" class="text-gray-800"></div>
<div class="grid grid-cols-1 sm:grid-cols-1 md:grid-cols-2 lg:grid-cols-2">
<div x-text="formatDateDisplay(t.date)" class="text-gray-500 text-xs"></div>
<div class="items-start text-right text-red-800" @click="removeTask(t.uuid)"><i class="fa fa-times-circle" aria-hidden="true"></i></div>
</div>
</div>
</div>
</template>
</div>
<div class="card m-1 p-1 cursor-pointer border border-gray-400 rounded-lg hover:shadow-md hover:border-opacity-0 transform hover:-translate-y-1 transition-all duration-200">
<div class="flex flex-row w-full py-2 px-2 m-1 text-sm text-red-800 bg-red-100">
Definir estratégia de VENDA:
<input class="shadow appearance-none border rounded w-1/3 py-2 px-2 my-1 mx-1 text-gray-700 leading-tight focus:outline-none focus:shadow-outline" id="valorvenda" type="text" placeholder="Valor" autofocus x-ref="valorvenda" @keydown.enter="addTask($refs.valorvenda.id)">
<input class="shadow appearance-none border rounded w-1/3 py-2 px-2 my-1 mx-1 text-gray-700 leading-tight focus:outline-none focus:shadow-outline" id="percentualvenda" type="text" placeholder="Percentual">
<input class="shadow appearance-none border rounded w-1/3 py-2 px-2 my-1 mx-1 text-gray-700 leading-tight focus:outline-none focus:shadow-outline" id="quantidadevenda" type="text" placeholder="Quantidade">
</div>
<template x-for="(t, taskIndex) in tasks.filter(t => t.coin === window.moeda && t.boardName === 'venda')" :key="taskIndex">
<div :id="t.uuid">
<div class="bg-white rounded-lg shadow mb-3 p-2 text-sm">
<div x-text="t.name" class="text-gray-800"></div>
<div class="grid grid-cols-1 sm:grid-cols-1 md:grid-cols-2 lg:grid-cols-2">
<div x-text="formatDateDisplay(t.date)" class="text-gray-500 text-xs"></div>
<div class="items-start text-right text-red-800" @click="removeTask(t.uuid)"><i class="fa fa-times-circle" aria-hidden="true"></i></div>
</div>
</div>
</div>
</template>
</div>
</div>
</div>
这里赋值一个JS函数是错误的原因。我需要的是每次 getTasks() 函数 运行 时更新 x 数据的方法,我不知道该怎么做。