小编Pat*_*han的帖子

我们有上运行的项目后端的NodeJS / expressJS / SequilizeJS作为RESTAPI。该RESTapi连接到VueJS SPA。

只有 5 人使用该系统。大多数操作都是事务。

我们得到一个错误

SequelizeConnectionAcquireTimeoutError：操作超时

这是我们的配置对象。

const sequelize = new Sequelize(
  config.database,
  config.username,
  config.password,
  {
    host: config.host,
    dialect: "mysql",
    pool: {
      max: 20,
      min: 0,
      acquire: 30000,
      idle: 10000
    }
  }
);

我们确信我们的服务器的内存不是问题。因为只使用了 5%。

这个错误来自哪里？

我正在尝试使用vee validate来验证使用此代码的密码.

<div>
    <input type="password"
           placeholder="Password"
           v-model="password"
           v-validate="'required|min:6|max:35|confirmed'"
           name="password" />
</div>
<div>
    <span>{{ errors.first('password') }}</span>
</div>
<div>
    <input type="password"
           placeholder="Confirm password"
           v-model="confirmPassword"
           v-validate="'required|target:password'"
           name="confirm_password" />
</div>
<div>
    <span>{{ errors.first('confirm_password') }}</span>
</div>

但它总是说密码确认不匹配. 我的代码出了什么问题？

任何帮助

提前致谢.

我的用例.

1. 我从后端api获得了一系列对象.
2. 我想渲染这些对象 v-select

这是我的代码.

<v-select
  :items="categories"
  name="category"
  label="Select a category"
  v-model="category"
  v-validate="'required'">
</v-select>

但它给了我输出.

但我希望对象名称属性显示在 v-select

我们会在vanilla Vue.js中这样做

<li v-for="cat in categories" :key="cat.name">{{cat.name}}</li>

但是这里有了vuetify,我们不能这样做.

:items="categories.name"

Vuetify文档

可以是对象数组或字符串数​​组.使用对象时,将查找文本和值字段.这可以使用item-text和item-value props进行更改.

他们实际上的意思item-text和item-value 我如何做到这一点使用item-text

任何帮助都要提前感谢.

这是我的简单 routes.js 文件。

import Vue from 'vue';
import VueRouter from 'vue-router';

Vue.use(VueRouter);

import welcome from './components/welcome.vue';
import restaurant from './components/restaurant.vue';
import eatMe from './components/eat-me.vue';

const routes = [{
    path: '/',
    component: welcome,
    name: welcome
}, {
    path: '/restaurant',
    component: restaurant
}, {
    path: '/eat-me',
    component: eatMe
}]

const router = new VueRouter({
    routes,
    mode: 'history'
});

export default router;

这工作正常。但是，如果有人转到 url 并键入除这 3 条路线之外的其他内容时，我希望将他定向到一条公共路线，并显示未找到页面。如何使用 vue.js 实现这一点

我是新手，vuetify.js并开始尝试它。

这是我的代码。

管理员面板

<v-content class="yellow">
  <v-container>
    <v-layout>
      <router-view></router-view>
    </v-layout>
  </v-container>
</v-content>

create-user.vue

<template>
    <v-container class="red">
        <v-layout class="blue">
            <v-flex md12>
                form
            </v-flex>
        </v-layout>
    </v-container>
</template>

在这里，我可以看到v-containerelement获得了可用的全宽。我想要的是v-container在create-user组件中获取相同的宽度。（黄色将消失，红色将填满屏幕）

我该如何实现？

我使用v-toolbar但是当我向下滚动时它消失了。基本上我想要一个粘性标题。

这基本上是我的代码。

<div id="app">
  <v-app>
    <v-toolbar dense>
    <v-toolbar-side-icon></v-toolbar-side-icon>
    <v-toolbar-title>Title</v-toolbar-title>
    <v-spacer></v-spacer>
    <v-toolbar-items class="hidden-sm-and-down">
      <v-btn flat>Link One</v-btn>
      <v-btn flat>Link Two</v-btn>
      <v-btn flat>Link Three</v-btn>
    </v-toolbar-items>
  </v-toolbar>
   <main>
     <h1 v-for="n in 20" :key="n">{{n}}</h1>
    </main>
  </v-app>
</div>

我的 vuetify v-data-table 有很多列。现在它会自动压缩到屏幕尺寸。相反，我想要的是向我的 v-data-tale 添加水平滚动条。之前在 1.5 版本中是有的，但在 2 版本中却没有了。

我的用例是这样的。

1. 当有人登录系统时，我会在登录操作中识别用户角色并将该值存储为 state。
2. 我有 3 个用户角色，即student、admin和dataEntry
3. 对于这 3 个角色，我也有 3 个单独的路由。（/student、/admin、/dataEntry）
4. 因此，我想根据用户角色将用户路由到系统。逻辑上是这样的。

if(userType == 'student'){
	router.push('/student')
},
if(userType == 'admin'){
	router.push('/admin')
}

我如何实现这一目标？我是 vueJS 的新手，我不知道把这些 if 条件放在哪里。

这是我的代码Store.js

import Vue from 'vue';
import Vuex from 'Vuex';
import axios from 'axios';
import router from './main.js';

Vue.use(Vuex);

export const store = new Vuex.Store({
  state:{

    idToken:null,
    userId:null,
    userType:null,
    userName:null

  },

  mutations:{

    authUser(state,userData){

      state.idToken = userData.token,
      state.userId  = userData.id,
      state.userName = userData.userName,
      state.userType = …

当我们尝试在Internet上填写表格时，必填字段使用红色的*标记，表示该字段是必填字段。

这样，是否有一种方法可以指示用户使用vuetify.js中的必填字段？

I use Material-UI TextField with an Icon inside like this. The label "Your good name here" should be next to the icon instead of overlapping it.

This happens after I added InputLabelProps={{ shrink: false }} to the TextField.

How could I fix this position correctly? Any help!

Thanks in advance! =)

This is my code pen

import React from "react";
import { makeStyles } from "@material-ui/core/styles";
import Input from "@material-ui/core/Input";
import InputLabel from "@material-ui/core/InputLabel";
import InputAdornment from "@material-ui/core/InputAdornment";
import …