Skip to content

Wrong description of custom directive in documentation(vue 3) #1428

Closed
@rinbowLi

Description

@rinbowLi

image
This is the description in the documentation(vue3)
the link to the documentation

  • test code
<script>
import { ref, onMounted,onBeforeMount } from "vue";
export default {
  directives: {
    focus: {
      beforeMount() {
        console.log("custom-directive's beforeMount");
      },
      mounted(el) {
        console.log("custom-directive's mounted");
        el.focus();
      },
    },
  },
  setup() {
    const inputValue = ref("123");


    onBeforeMount(() => {
      console.log("component's onBeforeMount");
    });

    onMounted(() => {
      console.log("component's onMounted");
    });


    return () => (
      <div>
        <h2>{inputValue.value}</h2>
        <input v-model={inputValue.value} v-focus />
      </div>
    );
  },
};
</script>

image

Here is a screenshot of the printout

Obviously the mounted of the custom directive is earlier than the onMounted of the component, so the documentation describes the error

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions