B
B
BonBon Slick2020-02-10 13:04:14
Vue.js
BonBon Slick, 2020-02-10 13:04:14

Vuetify Unknown custom element?

https://vuetifyjs.com/en/components/forms#forms

example from docs

<v-row align="center"
       justify="center"
       class="bg-e4"
>
    <v-col cols="12"
           sm="12"
           class="text-center pa-0 "
    >
        <v-form v-model="valid"
                ref="form"
        >
            <v-row>
                <v-col cols="12"
                       md="4"
                >
                    <v-text-field v-model="firstname"
                                  :rules="nameRules"
                                  :counter="10"
                                  label="First name"
                                  required
                    />
                </v-col>
            </v-row>
        </v-form>
    </v-col>
</v-row>

js
'use strict';

export default {
    //@todo -also display server errors!
    data: () => ({
        valid: false,
        firstname: '',
        lastname: '',
        nameRules: [
            fieldValue => !!fieldValue || 'Name is required',
            fieldValue => fieldValue.length <= 10 || 'Name must be less than 10 characters',
        ],
    }),
};


result
<div class="row bg-e4 align-center justify-center">
<div class="text-center pa-0 col-sm-12 col-12">
<v-form>
<div class="row">
<div class="col-md-4 col-12">

<v-text-field rules="function (fieldValue) {
        return !!fieldValue || 'Name is required';
      },function (fieldValue) {
        return fieldValue.length <= 10 || 'Name must be less than 10 characters';
      }" counter="10" label="First name" required="">
</v-text-field>
</div>
</div>
</v-form>
</div>
</div>


error
[Vue warn]: Unknown custom element: <v-form> - did you register the component correctly? For recursive components, make sure to provide the "name" option.

found in

---> <FormSearch> at layouts/people/partials/form_search/index.vue
       <VContent>
         <VApp>
           <DefaultLayout> at layouts/default.vue
             <Layouts/people/index.vue> at layouts/people/index.vue
               <Root>

Answer the question

In order to leave comments, you need to log in

1 answer(s)
A
Alex, 2020-02-10
@BonBonSlick

It looks like you just didn't plug it in.
The code itself seems to be working.

Didn't find what you were looking for?

Ask your question

Ask a Question

731 491 924 answers to any question