v-ons标记的问题并不适用

时间:2017-11-15 15:27:43

标签: onsen-ui

我试图用 Vue学习 onsenui 。 JS。

我使用cdn链接来使用onsen-vue。 ons 标记有效但v-ons标记不适用。 我得到的错误是

  

自定义标签未定义。

对于例如v-ons按钮不起作用但ons按钮有效。 我只是创建了html文件来测试它。 我还可以看到onsen-vue(2.4)被加载到资源中 我为Vue.js(2.4)添加了cdn

1 个答案:

答案 0 :(得分:0)

从温泉working example

查看HelloWorld的docs

它使用cdn版本的vue-onsenui@2.4和vue@2.4

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8" />
    <link rel="stylesheet" href="https://unpkg.com/onsenui@2.8.1/css/onsenui.min.css">
    <link rel="stylesheet" href="https://unpkg.com/onsenui@2.8.1/css/onsen-css-components.min.css">
    <script src="https://unpkg.com/vue@2.4.0/dist/vue.js"></script>
    <script src="https://unpkg.com/onsenui@2.8.1/js/onsenui.min.js"></script>
    <script src="https://unpkg.com/vue-onsenui@2.4.0/dist/vue-onsenui.js"></script>
</head>

<body>
<template id="main-page">
    <v-ons-page>
        <v-ons-toolbar>
            <div class="center">Title</div>
        </v-ons-toolbar>

        <p style="text-align: center">
            <v-ons-button @click="$ons.notification.alert('Hello World!')">
                Click me!
            </v-ons-button>
        </p>
    </v-ons-page>
</template>

<div id="app"></div>

<script>
    var vm = new Vue({
        el: '#app',
        template: '#main-page'
    });
</script>
</body>
</html>