錯(cuò)誤提示：

vue.common.js?e881:593 [Vue warn]: Unknown custom element: <s-identify> - did you register the component correctly? For recursive components, make sure to provide the "name" option.

found in

---> <Login> at E:\vue\vue-manage-system\src\components\page\Login.vue
       <App> at E:\vue\vue-manage-system\src\App.vue
         <Root>

main.js 調(diào)用

import Vue from 'vue';
import App from './App';
import router from './router';
import axios from 'axios';
import ElementUI from 'element-ui';
import 'element-ui/lib/theme-default/index.css';    // 默認(rèn)主題
// import '../static/css/theme-green/index.css';       // 淺綠色主題
import SIdentify from './components/page/Identify';
import "babel-polyfill";

Vue.use(SIdentify);
Vue.use(ElementUI);

Vue.prototype.$axios = axios;
new Vue({
    router,
    render: h => h(App)
}).$mount('#app');

頁面中使用：

<template>
    <div class="login-wrap">
        <div class="ms-title">登錄管理系統(tǒng)</div>
        <div class="ms-login">
            <el-form :model="ruleForm" :rules="rules" ref="ruleForm" label-width="0px" class="demo-ruleForm">
                <el-form-item prop="username">
                    <el-input v-model="ruleForm.username" placeholder="賬號(hào)" ></el-input>
                </el-form-item>
                <el-form-item prop="password">
                    <el-input type="password" placeholder="密碼" v-model="ruleForm.password" @keyup.enter.native="submitForm('ruleForm')"></el-input>
                </el-form-item>
                <el-form-item  prop="validate">
                    <el-input v-model="ruleForm.valiate" class="validate-code" placeholder="驗(yàn)證碼" ></el-input>
                    <div class="code" @click="refreshCode">
                        <s-identify :identifyCode="identifyCode"></s-identify>
                    </div>
                </el-form-item>
                <div class="login-btn">
                    <el-button type="primary" @click="submitForm('ruleForm')">登錄</el-button>
                </div>
                <p style="font-size:12px;line-height:30px;color:#999;cursor: pointer;float:right;" @click="handleCommand()">注冊(cè)</p>  
            </el-form>
        </div>
    </div>    
</template>

Identify.vue 文件

<template>
  <div class="s-canvas">
    <canvas id="s-canvas" :width="contentWidth" :height="contentHeight"></canvas>
  </div>
</template>
<script>
  export default{
    name: 'SIdentify',
    props: {
      identifyCode: {
        type: String,
        default: '1234'
      },

組件間嵌套
求原因