Skip to content
New issue

Have a question about this project? # for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “#”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? # to your account

VUE3 Uncaught (in promise) TypeError: this.$createElement is not a function #95

Open
ikkysleepy opened this issue Mar 30, 2021 · 0 comments

Comments

@ikkysleepy
Copy link

I got this error when trying to use VUE3 with vue-form-json-schema.

Uncaught (in promise) TypeError: this.$createElement is not a function
    at Proxy.pe (vue-form-json-schema.esm.js?4897:1)
    at Proxy.Oe (vue-form-json-schema.esm.js?4897:1)
    at eval (vue-form-json-schema.esm.js?4897:1)
    at Proxy.reduce (<anonymous>)
    at Proxy.et (vue-form-json-schema.esm.js?4897:1)
    at Proxy.pt (vue-form-json-schema.esm.js?4897:1)
    at cb (vue-form-json-schema.esm.js?4897:1)
    at Proxy.Q (vue-form-json-schema.esm.js?4897:1)
    at Proxy.vfjsBusEventHandler (vue-form-json-schema.esm.js?4897:1)
    at eval (vue-form-json-schema.esm.js?4897:1)
antiphishing.js:9377 

I used the vue3 rewrite branch: https://github.com/jarvelov/vue-form-json-schema/tree/vue3rewrite
and tried the simple example.

<template>
  <div id="example-one" class="container mb-3 mt-3">
    <h1>vue-form-json-schema</h1>
    <h3>
      Example #1
      <small class="text-muted">Minimal example</small>
    </h3>
    <p class="lead">
      <span>
        A minimal example showing a simple
        <code>input</code> field.
      </span>
    </p>
    <p class="text-center font-weight-bold">
      <a
        href="https://codesandbox.io/s/py6611pr9m"
        target="_blank"
        rel="noopener noreferrer"
        >Click here to edit this demo</a
      >
    </p>
    <p class="text-center font-weight-bold">
      <a
        href="https://py6611pr9m.codesandbox.io/"
        target="_blank"
        rel="noopener noreferrer"
        >Click here to show this demo in a separate window</a
      >
    </p>

    <vue-form-json-schema
      v-model="model"
      :schema="schema"
      :ui-schema="uiSchema"
      v-on:state-change="onChangeState"
      v-on:validated="onValidated"
    ></vue-form-json-schema>

    <hr />
  </div>
</template>

<script>
// Import VueFormJsonSchema
import VueFormJsonSchema from "vue-form-json-schema/dist/vue-form-json-schema.esm.js";
// We use a component to display JSON in a pretty way
// it is NOT included NOR required by VueFormJsonSchema
export default {
  name: "example-one",
  components: {
    "vue-form-json-schema": VueFormJsonSchema,
  },
  data() {
    return {
      model: {},
      state: {},
      valid: false,
      schema: {
        type: "object",
        properties: {
          firstName: {
            type: "string",
          },
        },
      },
      uiSchema: [
        {
          component: "input",
          model: "firstName",
          fieldOptions: {
            class: ["form-control"],
            on: ["input"],
            attrs: {
              placeholder: "Please enter your name",
            },
          },
        },
      ],
    };
  },
  methods: {
    onChangeState(value) {
      this.state = value;
    },
    onValidated(value) {
      this.valid = value;
    },
  },
};
</script>
# for free to join this conversation on GitHub. Already have an account? # to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant