我想在 vuetify 数据表中添加一些工具提示,但没有任何反应。
这是我需要使用工具提示的模板
<template v-slot:item.state="{ item }">
<div :class="lights(item)"></div>
</template>
Run Code Online (Sandbox Code Playgroud)
我像这样使用它
<v-tooltip left>
<template v-slot:activator="{ on }">
<template v-slot:item.state="{ item }">
<div :class="lights(item)"></div>
</template>
</template>
<span>Tooltip</span>
</v-tooltip>
Run Code Online (Sandbox Code Playgroud)
我还有一个需要工具提示的模态,但它也有一个 v 槽激活器:
<template v-slot:activator="{ toggle }">
<v-tooltip bottom>
<template v-slot:activator="{ on }" >
<v-icon :color="color" v-on="on" v-on="toggle">mdi-power</v-icon>
</template>
<span>Tooltip</span>
</v-tooltip>
</template>
Run Code Online (Sandbox Code Playgroud)
我能怎么做 ?
我有这个 vuetify 数据表,我希望在移动调整大小时保持相同的行为。所以我只想要同一行上的所有数据。
https://codepen.io/sebastiancz/pen/JjoVRVg?editable=true&editors=101
<div id="app">
<v-app id="inspire">
<v-data-table
:headers="headers"
:items="desserts"
:items-per-page="5"
class="elevation-1"
></v-data-table>
</v-app>
</div>
Run Code Online (Sandbox Code Playgroud)
new Vue({
el: '#app',
vuetify: new Vuetify(),
data () {
return {
headers: [
{
text: 'Dessert (100g serving)',
align: 'left',
sortable: false,
value: 'name',
},
{ text: 'Calories', value: 'calories' },
{ text: 'Fat (g)', value: 'fat' },
{ text: 'Carbs (g)', value: 'carbs' },
],
desserts: [
{
name: 'Frozen Yogurt',
calories: 159,
fat: 6.0,
carbs: 24
},
{
name: 'Ice cream …Run Code Online (Sandbox Code Playgroud) 有人知道如何根据服务器应答的结果显示小吃栏。
例如,如果提交正常,则显示成功的绿色小吃栏和成功消息,但如果出现错误,我需要显示红色错误小吃栏和错误消息的绑定。
我想我需要通过一个方法来显示它。我想在像这样的一个小吃店里做到这一点。
<v-snackbar
:color = "color"
> {{text here}}
</v-snackbar
Run Code Online (Sandbox Code Playgroud)
服务器帖子示例
http.post(apiAdresse, objectToPost)
.then(() => {
something to do here})
.catch(error => {
console.log(error)};)
Run Code Online (Sandbox Code Playgroud)
编辑代码:
<v-snackbar
:color="snackbar.color"
v-model="snackbar.show">
<v-icon class="snackIcon">{{snackbar.icon}}</v-icon>
{{ snackbar.message }}
<v-btn
dark
text
@click="snackbar = false"
>
Close
</v-btn>
</v-snackbar>
Run Code Online (Sandbox Code Playgroud)
当我点击关闭按钮时
Error in v-on handler: "TypeError: Cannot use 'in' operator to search for 'show' in false"
Run Code Online (Sandbox Code Playgroud) 我需要一个图标来完成按钮的工作(加载)但我会删除这个图标的圆形按钮效果
我怎样才能做到这一点 ? https://codepen.io/sebastiancz/pen/gOpjbar?editors=1010
<div id="app">
<v-app id="inspire">
<div class="text-xs-center">
<div>
<v-btn flat icon color="blue lighten-2">
<v-icon>power</v-icon>
</v-btn>
</div>
</div>
</v-app>
</div>
Run Code Online (Sandbox Code Playgroud)