帮酷LOGO
  • 显示原文与译文双语对照的内容
adminLTE to vuejs v2.x converting project

  • 源代码名称:vue2-admin-lte
  • 源代码网址:http://www.github.com/devjin0617/vue2-admin-lte
  • vue2-admin-lte源代码文档
  • vue2-admin-lte源代码下载
  • Git URL:
    git://www.github.com/devjin0617/vue2-admin-lte.git
  • Git Clone代码到本地:
    git clone http://www.github.com/devjin0617/vue2-admin-lte
  • Subversion代码到本地:
    $ svn co --depth empty http://www.github.com/devjin0617/vue2-admin-lte
    Checked out revision 1.
    $ cd repo
    $ svn up trunk


  • ( 演示)

    基于 Vuejs 2.x 前端框架的管理 控制面板 模板的AdminLTE 。

    文档

    https://devjin0617.gitbooks.io/vue2-admin-lte-guide/

    演示构建安装

    # install dependenciesnpm install# serve with hot reload at localhost:8080npm run dev# build for production with minificationnpm run build# build for production and view the bundle analyzer reportnpm run build --report# run unit tests: coming soon# npm run unit# run e2e tests: coming soon# npm run e2e# run all tests: coming soon# npm test

    :如何使用

    首先,通过npm安装 vue2-admin-lte

    $ npm i --save vue2-admin-lte

    web service中的附加别名配置

    module.exports= {
     resolve: {
     alias: {
     'va':'vue2-admin-lte/src' }
     }
    }

    导入css和javascript文件

    // css filesimport'va/lib/css'// js filesimport'va/lib/script'

    使用。vue中的组件

    <template>
     <va-buttonname="Primary"theme="primary"size="btn-lg" :isFlat="true"> </va-button>
    </template><script>importVAButtonfrom'va/components/VAButton.vue'exportdefault { name:'Button', components: {'va-button': VAButton }}</script>

    示例

    <template>
     <va-direct-chat :talkList="talkList" :badgeCount="3"theme="primary"title="Direct Chat"placeholder="Type Messages.. ."> </va-direct-chat>
    </template><script>importVADirectChatfrom'../path/to/components/VADirectChat.vue'exportdefault { name:'App',data () {return { talkList: [ { name:'Alexander Pierce', date:newDate(), profileImage:'http://path/to/image', message:`Is this template really for free? That's unbelievable`, isMine:false }, { name:'Sarah Bullock', date:newDate(), profileImage:'http://path/to/image', message:`You better believe it!`, isMine:true } ] } }, components: {'va-direct-chat': VADirectChat }}</script>

    如何启动模拟服务器

    node. /mock-server/index.js

    如何使用 Vuex

    ///vuex/store.jsimportVuefrom'vue'importVuexfrom'vuex'import*asactionsfrom'./actions'import*asgettersfrom'./getters'importmodulesfrom'./modules'Vue.use(Vuex)exportdefaultnewVuex.Store({
     actions,
     getters,
     modules,
     strict:process.env.NODE_ENV!=='production'})

    提供 Vue2 AdminLTE

    下面是一组帮助 Vue2 AdminLTE的准则。

    提交问题

    你可以在这里创建问题

    如果可以,请包括:

    • 你正在使用的浏览器的版本,名称
    • 你正在使用的操作系统

    其他有助于解决你的问题的事情:

    • 屏幕截图或者 gif
    • 开发工具或者警报
    • 执行搜索以查看是否已经提交类似的问题

    提交请求请求

    • 只要有可能,就可以在请求请求中包含屏幕截图和动画 gif 。
    • 使用简短的现在提交消息。



    Copyright © 2011 HelpLib All rights reserved.    知识分享协议 京ICP备05059198号-3  |  如果智培  |  酷兔英语