sea...
sea...

vue+vuetify建站

Vue+Vuetify建站(学习记录)

vue+vuetify+vue cli3

1.创建项目

vue create project-one

vue+vuetify建站_第1张图片
vue+vuetify建站_第2张图片
vue+vuetify建站_第3张图片
vue+vuetify建站_第4张图片
vue+vuetify建站_第5张图片
vue+vuetify建站_第6张图片
vue+vuetify建站_第7张图片

cd project-one	

cnpm run serve

vue+vuetify建站_第8张图片
vue+vuetify建站_第9张图片

2.用vue-cli添加vuetify程序包

vue add vuetify

vue+vuetify建站_第10张图片
vue+vuetify建站_第11张图片
vue+vuetify建站_第12张图片

3.vs code打开文件

vue+vuetify建站_第13张图片

4.安装vue-router

cnpm install vue-router --save

vue+vuetify建站_第14张图片

5.更改项目目录

（1）.删除文件Helloword.vue和app.vue中有关Helloword信息,并添加文件Home.vue与Team.vue,router.js,如图

vue+vuetify建站_第15张图片

（2）. 配置router.js

vue+vuetify建站_第16张图片
vue+vuetify建站_第17张图片

（3）.Home.vue与Team.vue

vue+vuetify建站_第18张图片
vue+vuetify建站_第19张图片

（4）.打开页面

vue+vuetify建站_第20张图片
vue+vuetify建站_第21张图片
大功告成！

你可能感兴趣的:(vue+vuetify)

  • vue+vuetify实现可编辑表格 平常心t
    image我查遍整个vuetify官网，里面只有弹出对话框的可编辑表格，并没有这种在表格内就可编辑的功能，所以写了这篇文章，以便大家备一手，学会这招你可以秒天秒地秒空气，防老师防领导防项目经理。HTML代码如下:可编辑表格NameCaloriesfatcarbsproteinironactions{{item.readonly?"修改":"保存"}}删除取消JS代码如下：newVue({el:'#
  • vue+vuetify v-text-field 组件的用scss高度改不掉 2301_78916954 vue.jsscsscss
    自存用它的嵌套语法不ok.a{.b{.v-slot-input{min-height:32px}}}复制粘贴控制台ok::v-deep.v-text-field--outlined.v-input--dense.v-text-field--outlined>.v-input__control>.v-input__slot{min-height:32px;}
  • goLang 中 gin框架实现文件上传（vue + go） 什么什么东东啊 gogolangginvue.js
    文章目录前言一、Gin框架二、代码示例1.前端1.1api配置1.2vue1.3js2.后端2.1router配置2.2实现上传3.上传保存效果总结前言在工作中，经常会遇到上传文件到服务器的需求，本篇文章结合工作实际情况，在vue与goLang的前后分离架构中实现文件上传存储。前端：vue+vuetify后端：go+gin一、Gin框架Gin是一个go写的web框架，具有高性能的优点。官方文档地址
  • Vue UI方式安装和创建 Vuetify 项目 一个平凡de人 web开发vue.jsnode.jswindows
    这是对视频内容的总结视频地址:一.前端开发快速上手(VUE+Vuetify)1.安装npmnpm:是nodejs下的包管理器。所以需要安装nodejswindows安装npm教程–nodejs2.安装Vue脚手架VueCLI安装可以使用下列任一命令安装这个新的包：npminstall-g@vue/cli#ORyarnglobaladd@vue/cli安装之后，你就可以在命令行中访问vue命令。你可
  • 如何用Vue+Vuetify快速建站？ 闭眼卖布
    懂点基础，学点套路，轻松用Vue写个网站几个月前用Vue+Vuetify这一套框架写了个仓库管理系统和个人网站，近来不写前端了，所以整理了如何用Vue，Vuetify，Vuex，Vue-router写一个单页应用(SPA)，为以后回忆方便，也供初学者参考，少踩坑。（这篇不是Vue的基础介绍，所以建议先读了Vue的官方文档，再来看怎么应用。）这篇以开发的个人网站为例，从一个空文件夹开始讲到完整个网站
  • 零基础VUE+Vuetify基础环境搭建并使用WebStorm开发 鸟德新之助 前端学习node.jsvuevue-cli3yarn
    零基础VUE+Vuetify基础环境搭建并使用WebStorm开发零基础VUE+Vuetify基础环境搭建node.js安装检查Vue版本使用WebStorm开发创建Vuetify项目零基础VUE+Vuetify基础环境搭建最近前端人口紧缺，加上我认为后端对前端也需要进行一定的了解，所以产生了这篇文章，来描述一个前端零基础的人搭建VUE+Vuetify的心路历程（踩坑之路）node.js安装这里需
  • 如何用Vue+Vuetify快速建站？ caoye214220
    几个月前用Vue+Vuetify这一套框架写了个仓库管理系统和个人网站，近来不写前端了，所以整理了如何用Vue，Vuetify，Vuex，Vue-router写一个单页应用(SPA)，为以后回忆方便，也供初学者参考，少踩坑。（这篇不是Vue的基础介绍，所以建议先读了Vue的官方文档，再来看怎么应用。）这篇以开发的个人网站为例，从一个空文件夹开始讲到完整个网站，其中包括这几个模块：配置开发环境配置W
  • vue+vuetify实现可编辑表格 平常心t vue.jshtmljavascript
    我查遍整个vuetify官网，里面只有弹出对话框的可编辑表格，并没有这种在表格内就可编辑的功能，所以写了这篇文章，以便大家备一手，学会这招你可以秒天秒地秒空气，防老师防领导防项目经理。HTML代码如下:可编辑表格NameCaloriesfatcarbsproteinironactions{{item.readonly?"修改":"保存"}}删除取消JS代码如下：newVue({el:'#app',
  • 前端 项目总结 hu741308125 项目
    本来想每周写一篇博客的然后国庆完发现项目太赶了于是就每天花了很多精力在项目上周末就躺着懒得动了。。。。。这个项目名字叫数据标准管理是给一个研究所做后台管理用的也算一个后台管理系统吧。需求点有文档的上传下载文档中的标准码表模型的管理树形目录数据库的导入标准码表的审核还有就是登录权限等技术栈是前端vue+vuetify(感觉没elment-ui好用)加后端javaspringboot(后端小哥哥说的)
  • vue+vuetify建站 sea... vue+vuetify
    Vue+Vuetify建站(学习记录)vue+vuetify+vuecli31.创建项目vuecreateproject-onecdproject-onecnpmrunserve2.用vue-cli添加vuetify程序包vueaddvuetify3.vscode打开文件4.安装vue-routercnpminstallvue-router--save5.更改项目目录（1）.删除文件Hellowo
  • Asp.net core 2.0 +SPA文件上传注意事项 Angeladaddy
    最近在做的一个工程，后端选用asp.net2.0core，前端用vue。选用core纯粹是好奇，想体验一下微软的新技术。还有就是实在不想写java...。技术组成如下：后端：asp.netcore2.0+JWTAuth+mongodb+RESTFul+swagger前端：Vue+Vuetify一开始一切都算顺利，可是到了文件上传环节，遇到了一点小挫折（掩面，其实是耽误了一天半时间），现在记录一下：
  • html 周华华 html
    js 1，数组的排列 var arr=[1,4,234,43,52,]; for(var x=0;x<arr.length;x++){    for(var y=x-1;y<arr.length;y++){      if(arr[x]<arr[y]){     &
  • 【Struts2 四】Struts2拦截器 bit1129 struts2拦截器
    Struts2框架是基于拦截器实现的，可以对某个Action进行拦截，然后某些逻辑处理，拦截器相当于AOP里面的环绕通知，即在Action方法的执行之前和之后根据需要添加相应的逻辑。事实上，即使struts.xml没有任何关于拦截器的配置，Struts2也会为我们添加一组默认的拦截器，最常见的是，请求参数自动绑定到Action对应的字段上。   Struts2中自定义拦截器的步骤是：
  • make:cc 命令未找到解决方法 daizj linux命令未知make cc
    安装rz sz程序时，报下面错误：   [root@slave2 src]# make posix cc   -O -DPOSIX -DMD=2 rz.c -o rz make: cc：命令未找到 make: *** [posix] 错误 127   系统：centos 6.6 环境：虚拟机   错误原因：系统未安装gcc，这个是由于在安
  • Oracle之Job应用 周凡杨 oracle job
    最近写服务，服务上线后，需要写一个定时执行的SQL脚本，清理并更新数据库表里的数据，应用到了Oracle 的 Job的相关知识。在此总结一下。   一：查看相关job信息    1、相关视图  dba_jobs  all_jobs  user_jobs  dba_jobs_running 包含正在运行
  • 多线程机制 朱辉辉33 多线程
    转至http://blog.csdn.net/lj70024/archive/2010/04/06/5455790.aspx 程序、进程和线程： 程序是一段静态的代码，它是应用程序执行的蓝本。进程是程序的一次动态执行过程，它对应了从代码加载、执行至执行完毕的一个完整过程，这个过程也是进程本身从产生、发展至消亡的过程。线程是比进程更小的单位，一个进程执行过程中可以产生多个线程，每个线程有自身的
  • web报表工具FineReport使用中遇到的常见报错及解决办法（一） 老A不折腾 web报表finereportjava报表报表工具
    FineReport使用中遇到的常见报错及解决办法（一） 这里写点抛砖引玉，希望大家能把自己整理的问题及解决方法晾出来，Mark一下，利人利己。   出现问题先搜一下文档上有没有，再看看度娘有没有，再看看论坛有没有。有报错要看日志。下面简单罗列下常见的问题，大多文档上都有提到的。   1、address pool is full： 含义：地址池满，连接数超过并发数上
  • mysql rpm安装后没有my.cnf 林鹤霄 没有my.cnf
    Linux下用rpm包安装的MySQL是不会安装/etc/my.cnf文件的， 至于为什么没有这个文件而MySQL却也能正常启动和作用，在这儿有两个说法， 第一种说法，my.cnf只是MySQL启动时的一个参数文件，可以没有它，这时MySQL会用内置的默认参数启动， 第二种说法，MySQL在启动时自动使用/usr/share/mysql目录下的my-medium.cnf文件，这种说法仅限于r
  • Kindle Fire HDX root并安装谷歌服务框架之后仍无法登陆谷歌账号的问题 aigo root
    原文：http://kindlefireforkid.com/how-to-setup-a-google-account-on-amazon-fire-tablet/   Step 4: Run ADB command from your PC   On the PC, you need install Amazon Fire ADB driver and instal
  • javascript 中var提升的典型实例 alxw4616 JavaScript
    // 刚刚在书上看到的一个小问题,很有意思.大家一起思考下吧 myname = 'global'; var fn = function () { console.log(myname); // undefined var myname = 'local'; console.log(myname); // local }; fn() // 上述代码实际上等同于以下代码 m
  • 定时器和获取时间的使用 百合不是茶 时间的转换定时器
    定时器:定时创建任务在游戏设计的时候用的比较多   Timer();定时器 TImerTask();Timer的子类  由 Timer 安排为一次执行或重复执行的任务。       定时器类Timer在java.util包中。使用时，先实例化，然后使用实例的schedule(TimerTask task, long delay)方法，设定
  • JDK1.5 Queue bijian1013 javathreadjava多线程Queue
    JDK1.5 Queue LinkedList： LinkedList不是同步的。如果多个线程同时访问列表，而其中至少一个线程从结构上修改了该列表，则它必须 保持外部同步。（结构修改指添加或删除一个或多个元素的任何操作；仅设置元素的值不是结构修改。）这一般通过对自然封装该列表的对象进行同步操作来完成。如果不存在这样的对象，则应该使用 Collections.synchronizedList 方
  • http认证原理和https bijian1013 httphttps
    一.基础介绍         在URL前加https://前缀表明是用SSL加密的。 你的电脑与服务器之间收发的信息传输将更加安全。         Web服务器启用SSL需要获得一个服务器证书并将该证书与要使用SSL的服务器绑定。 http和https使用的是完全不同的连接方式，用的端口也不一样,前者是80，后
  • 【Java范型五】范型继承 bit1129 java
    定义如下一个抽象的范型类，其中定义了两个范型参数，T1，T2   package com.tom.lang.generics; public abstract class SuperGenerics<T1, T2> { private T1 t1; private T2 t2; public abstract void doIt(T
  • 【Nginx六】nginx.conf常用指令(Directive) bit1129 Directive
    1. worker_processes    8; 表示Nginx将启动8个工作者进程，通过ps -ef|grep nginx,会发现有8个Nginx Worker Process在运行   nobody 53879 118449 0 Apr22 ? 00:26:15 nginx: worker process
  • lua 遍历Header头部 ronin47 lua header 遍历　
    local headers = ngx.req.get_headers()   ngx.say("headers begin", "<br/>")   ngx.say("Host : ", he
  • java-32.通过交换a,b中的元素，使[序列a元素的和]与[序列b元素的和]之间的差最小(两数组的差最小)。 bylijinnan java
    import java.util.Arrays; public class MinSumASumB { /** * Q32.有两个序列a,b，大小都为n,序列元素的值任意整数，无序. * * 要求：通过交换a,b中的元素，使[序列a元素的和]与[序列b元素的和]之间的差最小。 * 例如: * int[] a = {100,99,98,1,2,3
  • redis 开窍的石头 redis
    在redis的redis.conf配置文件中找到# requirepass foobared 把它替换成requirepass 12356789 后边的12356789就是你的密码 打开redis客户端输入config get requirepass 返回 redis 127.0.0.1:6379> config get requirepass 1) "require
  • [JAVA图像与图形]现有的GPU架构支持JAVA语言吗？ comsci java语言
          无论是opengl还是cuda，都是建立在C语言体系架构基础上的，在未来，图像图形处理业务快速发展，相关领域市场不断扩大的情况下，我们JAVA语言系统怎么从这么庞大，且还在不断扩大的市场上分到一块蛋糕，是值得每个JAVAER认真思考和行动的事情       
  • 安装ubuntu14.04登录后花屏了怎么办 cuiyadll ubuntu
    这个情况，一般属于显卡驱动问题。 可以先尝试安装显卡的官方闭源驱动。 按键盘三个键：CTRL + ALT  +  F1 进入终端，输入用户名和密码登录终端： 安装amd的显卡驱动 sudo  apt-get  install  fglrx 安装nvidia显卡驱动 sudo  ap
  • SSL 与 数字证书 的基本概念和工作原理 darrenzhu 加密ssl证书密钥签名
    SSL 与 数字证书 的基本概念和工作原理 http://www.linuxde.net/2012/03/8301.html SSL握手协议的目的是或最终结果是让客户端和服务器拥有一个共同的密钥，握手协议本身是基于非对称加密机制的，之后就使用共同的密钥基于对称加密机制进行信息交换。 http://www.ibm.com/developerworks/cn/webspher
  • Ubuntu设置ip的步骤 dcj3sjt126com ubuntu
    在单位的一台机器完全装了Ubuntu Server，但回家只能在XP上VM一个，装的时候网卡是DHCP的，用ifconfig查了一下ip是192.168.92.128,可以ping通。 转载不是错： Ubuntu命令行修改网络配置方法 /etc/network/interfaces打开后里面可设置DHCP或手动设置静态ip。前面auto eth0，让网卡开机自动挂载. 1. 以D
  • php包管理工具推荐 dcj3sjt126com PHPComposer
    http://www.phpcomposer.com/   Composer是 PHP 用来管理依赖（dependency）关系的工具。你可以在自己的项目中声明所依赖的外部工具库（libraries），Composer 会帮你安装这些依赖的库文件。 中文文档  入门指南  下载  安装包列表 Composer 中国镜像
  • Gson使用四（TypeAdapter） eksliang jsongsonGson自定义转换器gsonTypeAdapter
    转载请出自出处：http://eksliang.iteye.com/blog/2175595 一.概述        Gson的TypeAapter可以理解成自定义序列化和返序列化 二、应用场景举例        例如我们通常去注册时（那些外国网站），会让我们输入firstName，lastName,但是转到我们都
  • JQM控件之Navbar和Tabs gundumw100 htmlxmlcss
    在JQM中使用导航栏Navbar是简单的。 只需要将data-role="navbar"赋给div即可： <div data-role="navbar"> <ul> <li><a href="#" class="ui-btn-active&qu
  • 利用归并排序算法对大文件进行排序 iwindyforest java归并排序大文件分治法Merge sort
      归并排序算法介绍，请参照Wikipeida zh.wikipedia.org/wiki/%E5%BD%92%E5%B9%B6%E6%8E%92%E5%BA%8F 基本思想： 大文件分割成行数相等的两个子文件，递归（归并排序）两个子文件，直到递归到分割成的子文件低于限制行数 低于限制行数的子文件直接排序 两个排序好的子文件归并到父文件 直到最后所有排序好的父文件归并到输入
  • iOS UIWebView URL拦截 啸笑天 UIWebView
    本文译者：candeladiao，原文：URL filtering for UIWebView on the iPhone说明：译者在做app开发时，因为页面的javascript文件比较大导致加载速度很慢，所以想把javascript文件打包在app里，当UIWebView需要加载该脚本时就从app本地读取，但UIWebView并不支持加载本地资源。最后从下文中找到了解决方法，第一次翻译，难免有
  • 索引的碎片整理SQL语句 macroli sql
    SET NOCOUNT ON DECLARE @tablename VARCHAR (128) DECLARE @execstr VARCHAR (255) DECLARE @objectid INT DECLARE @indexid INT DECLARE @frag DECIMAL DECLARE @maxfrag DECIMAL --设置最大允许的碎片数量,超过则对索引进行碎片
  • Angularjs同步操作http请求with $promise qiaolevip 每天进步一点点学习永无止境AngularJS纵观千象
    // Define a factory app.factory('profilePromise', ['$q', 'AccountService', function($q, AccountService) { var deferred = $q.defer(); AccountService.getProfile().then(function(res) {
  • hibernate联合查询问题 sxj19881213 sqlHibernateHQL联合查询
    最近在用hibernate做项目，遇到了联合查询的问题，以及联合查询中的N+1问题。 针对无外键关联的联合查询，我做了HQL和SQL的实验，希望能帮助到大家。（我使用的版本是hibernate3.3.2）   1 几个常识：  （1）hql中的几种join查询，只有在外键关联、并且作了相应配置时才能使用。  （2）hql的默认查询策略，在进行联合查询时，会产
  • struts2.xml wuai struts
    <?xml version="1.0" encoding="UTF-8" ?> <!DOCTYPE struts PUBLIC "-//Apache Software Foundation//DTD Struts Configuration 2.3//EN" "http://struts.apache
按字母分类： ABCDEFGHIJKLMNOPQRSTUVWXYZ其他