[Vuejs]-Deep in slots vue 2

by

0👍

You forgot to share your Search component and the rest of the other components (namely, the script section). There is no limit in the slot depth (whatever that means). I’m assuming you have some other errors in parts you haven’t shared. My first guess would be the way you have set the props in your Search component.

Here is an example of a working version on how you should set a nullable prop on a component:

Last.vue

<template>
    <Wrapper>
        <template #wrapper>
          <label>
              <input type="text" v-model="value">
          </label>

          <Search :value=value />
        </template>
    </Wrapper>
</template>

<script>
import Wrapper from "@/components/Wrapper";
import Search from "@/components/Search";

export default {
    components: {Search, Wrapper},

    data() {
        return {
            value: null
        }
    }
}
</script>

Search.vue

<template>
    <p>{{ value }}</p>
</template>

<script>
export default {
    props: {
        value: {
            type: String,
            default: null,
        }
    },
}
</script>

If this doesn’t address your problem, please share the rest of your code and I’d be glad to help!

Leave a comment