提问人：bob 提问时间：10/20/2023 更新时间：10/20/2023 访问量：21
如何将输入组件属性更改为 pinia 的数据 vue3
How to change the input component attribute conforimng to the pinia's data vue3
问：
我有一个带有动态属性:p laceholder？如果状态的对象不同，如何通过条件运算符动态更改占位符值？我还可以以某种方式将 if 语句作为组件的方法更好地放在外面吗？
// store
import { defineStore } from 'pinia'
export const useStore = defineStore('storeId', {
state: () => {
return {
const inputs = [
{
id: 1,
type: 'email'
},
{
id: 2,
type: 'text'
},
{
id: 3,
type: 'password'
}
]
},
})
// Child component
<script setup >
const someStore = useSomeStore()
<div v-for="input in someStore.inputs">
<Input
:type="input.type"
:placeholder="
if(input.type === email) {'place enmail'}
else-if(input.type === text) {'place text'}"
elxe {'place password'}
/>
</div>
</script>答：
0赞
LOC
10/20/2023
#1
您可以使用 Pinia Action Pinia Action
actions: {
getPlaceholder(inputType) {
if (inputType == 'email') {
return 'place enmail';
} else if (.........)........
}}
或者可以创建一些帮助程序 .js，然后导出一些相同的函数
并像这样使用它
<Input
:type="input.type"
:placeholder="someStore.getPlaceholder(input.type)"
/>
评论