个人中心
文章发布
退出
作者热门文章
- html - 出于某种原因，IE8 对我的 Sass 文件中继承的 html5 CSS 不友好？
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景？
26
4
我正在开发一个新的 Laravel项目，我想使用Vuetify .
我设法配置并创建了默认布局。
这是我的 master,blade.php 布局文件:
<!DOCTYPE html>
<html lang="{{ config('app.locale') }}">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- CSRF Token -->
<meta name="csrf-token" content="{{ csrf_token() }}">
<title>{{ config('app.name', 'Laravel') }}</title>
<link href="{{ asset('css/app.css') }}" rel="stylesheet">
<link href="{{ asset('css/vuetify.min.css') }}" rel="stylesheet">
<script>
window.Laravel = {!! json_encode([
'csrfToken' => csrf_token(),
]) !!};
</script>
</head>
<body>
<v-app id="app" top-toolbar footer v-cloak>
<v-navigation-drawer persistent light :mini-variant.sync="mini" v-model="drawer">
<v-list class="pa-0">
<v-list-item>
<v-list-tile avatar tag="div">
<v-list-tile-avatar>
<img src="http://ma.twyn.com/bilder/tba.jpg" />
</v-list-tile-avatar>
<v-list-tile-content>
<v-list-tile-title>Tamás Barta</v-list-tile-title>
</v-list-tile-content>
<v-list-tile-action>
<v-btn icon @click.native.stop="mini = !mini">
<v-icon>chevron_left</v-icon>
</v-btn>
</v-list-tile-action>
</v-list-tile>
</v-list-item>
</v-list>
<v-list class="pt-0" dense>
<v-divider></v-divider>
<v-list-item v-for="item in items" :key="item">
<v-list-tile>
<v-list-tile-action>
<v-icon>@{{ item.icon }}</v-icon>
</v-list-tile-action>
<v-list-tile-content>
<v-list-tile-title><a href="/partners">@{{ item.title }}</a></v-list-tile-title>
</v-list-tile-content>
</v-list-tile>
</v-list-item>
</v-list>
</v-navigation-drawer>
<v-toolbar fixed class="primary darken-4" light>
<v-toolbar-side-icon light @click.native.stop="drawer = !drawer"></v-toolbar-side-icon>
<v-toolbar-title>PRM</v-toolbar-title>
</v-toolbar>
<main>
<v-container fluid>
@yield('content')
<!--v-router-->
</v-container>
</main>
</v-app>
<script src="{{ asset('js/app.js') }}"></script>
<script src="{{ asset('js/prm.js') }}"></script>
</body>
</html>
最佳答案
您可以通过多种方式在 Laravel 中使用 Vue(w/Vuetify)。您可以在 Blade 模板中使用它，只要您的 javascript 文件安装到 DOM，该绑定(bind)中使用的任何组件/Vue 都可以正常工作。
你也可以使用可以设置的 Laravel/Vue 样板，https://laravel.com/docs/5.4/frontend ，并使用 Vue 模板文件创建所有标记。
关于frontend - 使用 Laravel 进行 Vuetify，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/44429666/
26
4
0
有没有办法覆盖 Vuetify carousel 下一个/上一个图标上的样式？我看到有些字段可以使用自定义字段，但我想保留默认的 $vuetify.icons.next 并只更改其颜色。 最佳答案 在
我想要一个 option group (如 this )在 vuetify select 上. 那可能吗？如果是，我该怎么做？ 最佳答案 过时 :请参阅下面的@DevNik 答案以了解正确实现 您可以
使用 vuetify expanded table但展开箭头在左侧显示为第一项。我怎样才能最后显示它(右侧)，如 Expandable rows 所示例子？
我是 Vuetify 的新手(有史以来的第一个项目)，我正在尝试在列粘性顶部内设置一张卡片。不幸的是没有按预期工作。我也尝试使用 vue-sticky-directive 中的 v-scroll 指令
我的 vuetify v-data-table 有很多列。现在它会自动压缩到屏幕尺寸。而不是我想要的是向我的 v-data-tale 添加水平滚动条。之前在 1.5 版中存在，但在版本 2 中不存在。
我从 Vuetify 导入了数据表组件，除了 Rows per page 部分之外，它工作正常。它不会打开应包含 [5, 10, 20] 的列表来重新组织数据表。 照片中的更新这是错误，选项列表显示在
怎么设置vuetify嵌套列表默认关闭？文档示例显示了嵌套列表功能，但在添加到应用程序时默认情况下会打开嵌套列表。 https://vuetifyjs.com/en/components/naviga
我知道这个问题 change-default-font-in-vuetify在 SO，但它没有解决我的问题，因为它是在 vue-cli-3 出现之前发布的，所以那里的想法在这里并不适用，官方文档来自
我正在使用 nuxt.js 和 vuetify 创建一个网站，我想将 bool 复选框文本的颜色更改为黑色，默认情况下为白色，请参阅 here !我怎样才能改变颜色？ 我已经尝试过使用类 black-
我正在使用 nuxt.js 和 vuetify 创建一个网站，我想将 bool 复选框文本的颜色更改为黑色，默认情况下为白色，请参阅 here !我怎样才能改变颜色？ 我已经尝试过使用类 black-
以前(我认为？)可以将 HTML 放入 vuetify 提示中，但对我来说这不再有效。例如，在我的一个组件中我有: Red hint" /> 此提示以前显示为红色，但现在我看到了完整的 HTML 代码
当 v-data-table 在移动 View 上时，项目之间的分隔线不清晰。如何自定义此分隔线，例如线宽和颜色？ 我想做的: Custom divider on mobile view 来自 vue
我想整体更改数据表的背景颜色。我不想使用深色主题或浅色主题。即使使用 !important 或使用可用类，我似乎也无法更改它。 最佳答案 只需添加相关的颜色类，例如class="primary"或 v
我正在尝试将对话框和 snackbar 的使用与 VueJS 结合起来。问题如下: 预期行为: 我应该能够在不关闭对话框的情况下关闭 snackbar 现在发生了什么: 单击 snackbar 时正在
如果不使用 vuetify fork，我无法找到一个好的解决方案，它不稳定并且无论如何似乎都是旧版本。我会在评论中链接到它。 我能想到的唯一方法是将两个数据表并排排列，这本身就会产生问题。我知道还有其
我需要一个 v-text-field用户可以在其中输入他们通过短信收到的确认码。即使用户没有写大写字母的意图，该字段的内容也应该全部自动转换为大写字母。 最佳答案 您可以使用 keyup事件大写是这样
我正在尝试创建一个搜索输入字段，其中包含下拉列表中先前搜索的历史记录，例如 Intellij 编辑器中的搜索字段。 我是 Vuetify 的新手，从我目前看到的情况来看，Combobox 是最好的组件
v-select允许添加append-outer-icon，但是如何在点击该项时强制展开图标列表？ @click:append-outer 允许添加回调函数，但我在 openSelect 中做了什
我的代码是这样的: OK 演示是这样的:https://codepen.io/positivethinking639/pen/GRRNzVE?
单击(例如)此页面上的任何 CodePen 链接:https://vuetifyjs.com/en/components/navigation-drawers 注意无样式内容的闪光。你如何消除这个？
我是一名优秀的程序员,十分优秀！