Javascript 如何使用vue js为字体系列创建下拉菜单？

我有以下

select

，其中包含我希望适用于我的文本的字体系列：

字体
{{font}}

我尝试使用Vue.js创建下拉菜单，但失败了。这是我的数据对象：

数据：{
可用字体：[
“Pacifico”，
“舞蹈剧本”，
“影子变成光明”，
“龙虾”，
“安东”，
“独立之花”，
“查蒙曼”，
“科恰桑”，
“值得注意”，
“马里”，
“斯利萨克迪”，
“Slabo 27px”
]
}

您可以检查以下解决方案，因此通过指令

v-model

将您的

select

输入绑定到名为

focused\u font

的数据对象属性，其中

select

中的每个

选项都包含一个字体系列名称，该名称依次适用于该选项，我添加了一些文本，通过
：style=“{fontFamily:focused_font}”
绑定样式来查看选择效果


newvue({
el:“#应用程序”，
数据：{
聚焦字体：“”，
可用字体：[“Pacifico”、“舞蹈脚本”、“阴影入光”、“龙虾”、“安东”、“独立之花”、“Charmonman”、“Kodchasan”、“著名”、“马里”、“Srisakdi”、“Slabo 27px”]
}
})

字体
{{font}}
一些要测试字体的文本

您可以检查以下解决方案，因此通过指令
v-model
将您的
select
输入绑定到名为
focused\u font
的数据对象属性，其中
select
中的每个
选项都包含一个字体系列名称，该名称依次适用于该选项，我添加了一些文本，通过
：style=“{fontFamily:focused_font}”
绑定样式来查看选择效果


newvue({
el:“#应用程序”，
数据：{
聚焦字体：“”，
可用字体：[“Pacifico”、“舞蹈脚本”、“阴影入光”、“龙虾”、“安东”、“独立之花”、“Charmonman”、“Kodchasan”、“著名”、“马里”、“Srisakdi”、“Slabo 27px”]
}
})

字体
{{font}}
一些要测试字体的文本

“但我彻底失败了”你的
标签上的
在干什么？“但我彻底失败了”你的
标签上的
@
在干什么？