vue+node.js学习笔记

一、搭建vue开发环境

vue init webpack newmall

cnpm install

npm run dev

二、测试静态页

把静态页的css拷贝进来

src目录下建立views文件夹，专门放置页面。

首先建立一个GoodsList页面

将静态html拷贝进来

引入css

更改路由

此时 8080端口首页就可以展示商品列表

注意：

引入路径时候也可以

import GoodsList from ‘@/views/GoodsList.vue‘

@定义的位置在build/webpack.base.conf

在这里把图片资源放在根目录的static下，和css静态资源的位置不一样

三、拆分组件

建立compontents文件夹专门放置组件

将GoodsList页面的header部分剪切到compontents下的NavHeader.vue文件里

此时GoodsList页面需要

1、引入navheader组件

2、注册组件

3、使用组件

四、关于插槽

面包屑导航内的某个值是不固定的，所以要使用插槽

NavBread页面

GoodsList页面

这样一来，Goods就插入到指定的槽位了。

时间： 2024-10-10 16:37:36

vue+node.js学习笔记的相关文章

Node.js学习笔记(3) - 简单的curd

这个算是不算完结的完结吧,前段时间也是看了好久的Node相关的东西,总想着去整理一下,可是当时也没有时间: 现在看来在整理的话,就有些混乱,自己也懒了,就没在整理,只是简单的记录一下 一.demo的简单介绍 这次demo,只涉及到简单的curd操作,用到的数据库是mongo,所以要安装mongo数据库,数据库连接驱动是mongoose: 当然关于mongo的驱动有很多,比如mongous mongoskin等:(详见http://cnodejs.org/topic/4f4ca8e0940ce2e

系列文章--Node.js学习笔记系列

Node.js学习笔记系列总索引 Nodejs学习笔记(一)--- 简介及安装Node.js开发环境 Nodejs学习笔记(二)--- 事件模块 Nodejs学习笔记(三)--- 模块 Nodejs学习笔记(四)--- 与MySQL交互(felixge/node-mysql) Nodejs学习笔记(五)--- Express安装入门与模版引擎ejs Nodejs学习笔记(六)--- Node.js + Express 构建网站预备知识 Nodejs学习笔记(七)--- Node.js + Exp

Node.js学习笔记【1】入门（服务器JS、函数式编程、阻塞与非阻塞、回调、事件、内部和外部模块）

笔记来自<Node入门>@2011 Manuel Kiessling JavaScript与Node.js Node.js事实上既是一个运行时环境,同时又是一个库. 使用Node.js时,我们不仅仅在实现一个应用,同时还实现了整个HTTP服务器. 一个基础的HTTP服务器 server.js:一个可以工作的HTTP服务器 var http = require("http"); http.createServer(function(request, response) { r

Node.js学习笔记【3】NodeJS基础、代码的组织和部署、文件操作、网络操作、进程管理、异步编程

一.表 学生表 CREATE TABLE `t_student` ( `stuNum` int(11) NOT NULL auto_increment, `stuName` varchar(20) default NULL, `birthday` date default NULL, PRIMARY KEY  (`stuNum`) ) ENGINE=InnoDB DEFAULT CHARSET=utf8 学生分数表 CREATE TABLE `t_stu_score` ( `id` int(11

node.js学习笔记目录

1.node.js学习笔记(1)--Node.js简介及环境安装 2.node.js学习笔记(2)--使用Express快速创建应用 3.node.js学习笔记(3)--Express创建的项目分析 4.node.js学习笔记(4)--使用Express完成简单的登陆 5.node.js学习笔记(5)--MongoDB下载及安装 6.node.js学习笔记(6)--MongoDB简单入门 7.node.js学习笔记(7)--Node.js与MongoDB简单交互 8.node.js学习笔记(8)

node.js 学习笔记

学习网站:http://www.nodejs.net/a/20141016/232139.html: 笔记:介绍如何利Javascript做为服务端脚本,通过Nodejs框架web开发.Nodejs框架是基于V8的引擎,是目前速度最快的Javascript引擎.chrome浏览器就基于V8,同时打开20-30个网页都很流畅.Nodejs标准的web开发框架Express,可以帮助我们迅速建立web站点,比起PHP的开发效率更高,而且学习曲线更低.非常适合小型网站,个性化网站,我们自己的Geek网

node.js 学习笔记1-mocha

1.mocha是什么 mocha是一款流行的额JavaScript测试框架. 2.mocha的基本用法 1.使用npm 安装mocha包,我并没有选择全局安装.只是在mocha的文件夹里的Package.json添加mocha的依赖. 如下图 { "name": "mocha-test", "version": "0.0.1", "dependencies": { "koa": &quo

node.js学习笔记（一）——创建第一个应用

巧妇难为无米之炊.要学习node.js,当然必须先有node.js环境(可以去官网 http://nodejs.cn/ 下载安装),如果还是不懂怎么配置开发环境,度娘会告诉你一切. 安装完成环境之后,先别急着开发.在开发之前,为了更清晰的掌握接下来我们的第一个应用的代码逻辑,我们还需要了解一下node.js 应用的基本组成成分,如下: 1. 引入 required 模块:我们可以使用 require 指令来载入 Node.js 模块. 2. 创建服务器:服务器可以监听客户端的请求,类似于 Apa

node.js学习笔记之写文件

node.js之写文件 //---------------optfile.js------------------var  fs=  require('fs');module.exports={    writefile:function(path,data){    //异步方式        fs.writeFile(path,  data,  function  (err)  {            if  (err)  {                throw  err;