首先，不得不说微信小程序的开发文档确实写得不错

作为一个微信小程序开发的新手来说，其实入门也就只需要看官方的开发文档就足够了。
中文文档，通俗易懂，有代码片段示例，也可以直接在微信开发者工具上浏览相关示例的完整代码。
这估计也是我为什么在网上没有找到其他微信小程序入门教程的原因了。

为什么使用nuxt.js?

vue单页面应用渲染是从服务器获取所需js，在客户端将其解析生成html挂载于
id为app的DOM元素上，这样会存在两大问题。

1. 由于资源请求量大，造成网站首屏加载缓慢，不利于用户体验。
2. 由于页面内容通过js插入，对于内容性网站来说，搜索引擎无法抓取网站内容，不利于SEO。
   Nuxt.js 是一个基于Vue.js的通用应用框架，预设了利用Vue.js开发服务端渲染的应用所需要的各种配置。可以将html在服务端渲染，合成完整的html文件再输出到浏览器。

除此之外，nuxt与vue还有一些其他方面的区别。

单页面应用

第一次进入页面时会请求一个html文件，刷新清除一下，切换到其他组件，此时路径也相应变化，但是并没有新的html文件请求，页面内容却变化了。

原理： js会感知到url的变化，通过这一点可以用js动态地将当前页面的内容清除，然后将下一个页面的内容挂载到当前页面上。这个时候的路由不再是后端来做了，而是前端来做，判断页面显示相应的组件，清除不需要的。

页面跳转： js渲染
优点： 页面切换快
缺点： 首屏时间稍慢，SEO差

Vue跨域配置

在Vue项目目录中打开config/index.js,在proxyTable中添写如下代码：

1
2
3
4
5
6
7
8
9

proxyTable: { 
  '/api': {  //使用"/api"来代替"http://  你的地址（http://127.0.0.1:3000）" 
    target: 'http:// 你的地址 ',    //源地址 
    changeOrigin: true,    //改变源 
    pathRewrite: { 
      '^/api': 'http://  上面的地址，或者空着不写'     //路径重写 
      } 
  } 
}

watch computed 使用及理解概念

watch 使用理解

v-model 绑定input input 一个对象来理解

(val) 就是当前的v-model 的value 值 动态监听 数据变化执行事件

computed 绑定input 这个变量 input 变动 才执行绑定的这个函数

然后 return 才能返回值 这个函数 对应的的 值就是return 返回的值

函数就相当 key

相当与绑定 某个值 监听变化

input 动态监听 还有原生的方法 @input=””

一，什么是Vuex？

  **vuex是一个专为vue.js应用程序开发的状态管理模式。**vuex解决了组件之间同一状态的共享问题。当我们的应用遇到多个组件之间的共享问题时会需要：

 多个组件依赖于同一状态。传参的方法对于多层嵌套的组件将会变得很繁琐，并且对于兄弟组件间的传递无能为力。这需要你去学习下，vue的编码中多个组件之间的通讯的做法。来自不同组件的行为需要变更同一状态。我们经常会采用父子组件直接引用或者通过事件来变更和同步状态的多份拷贝。以上的这些模式都很脆弱，通常会导致无法维护代码。所以，这时就出现了Vuex，这是Vuex出现的背景。Vuex官网上这样描述：Vuex是一个专为Vue.js应用程序开发的状态管理模式。

他采用集中式存储管理应用的所有组件的状态。这里的关键在于集中式存储管理。这意味着本来需要共享状态的更新是需要组件之间的通讯，而现在有了vuex，组件就都和store通讯了。这也是为什么官网再次会提到Vuex构建大型应用的价值，如果你不打算开大大型的单页应用，使用Vuex可能会变得很繁琐，对于大型项目，可以使用Vuex作为不同组件之间的状态管理，而对于小型的项目，推荐使用HTML5特有的属性，localStroage和sessionStroage作为数据之间的传递。

上面的深入的理解可以给你对Vuex有一个简单的认识，但是Vuex的具体作用是什么呢？通俗的讲：

Vuex是一个状态管理的插件，可以解决不同组件之间的数据共享和数据持久化。

一、meta标签的效果

1. 移动端页面一般会在head头部添加如下meta标签。

1

<meta name="viewport" content="width=device-width, initial-scale=1.0">

1. 该meta标签是否添加对页面渲染的影响
   在移动端，未添加该meta标签时，html元素的宽度一般为980px；添加该meta标签之后，html的宽度与设备物理尺寸宽度一致。

   阅读全文 »

mongoose知识

• 定义：

  • mongoose为mongodb的进化版，相当于原生JS和jQuery的关系；

• 步骤：

  1. 引入模块：const mongoose=require("mongoose");

  2. 连接数据库：mongoose.connect("mongodb://localhost:27017/tiankong",{ useNewUrlParser: true });

  3. 创建一个schema,规定数据的结构和规则;

     1 2 3 4 5

     var carSchema=new mongoose.Schema({ name:String, age:Number, sex:String });

  4. 创建一个类，相当于一个集合；如：

     1	var Pig=mongoose.model("com",carSchema);

     ;

     • 注：其中”com”,则为创建的集合，无论大小写，都默认小写的集合名；外加一个s;即：coms；

  5. 通过类的实例或静态属性，来对数据进行操作；

  阅读全文 »

Node.js是目前非常火热的技术，但是它的诞生经历却很奇特。

众所周知，在Netscape设计出JavaScript后的短短几个月，JavaScript事实上已经是前端开发的唯一标准。

后来，微软通过IE击败了Netscape后一统桌面，结果几年时间，浏览器毫无进步。（2001年推出的古老的IE 6到今天仍然有人在使用！）

没有竞争就没有发展。微软认为IE6浏览器已经非常完善，几乎没有可改进之处，然后解散了IE6开发团队！而Google却认为支持现代Web应用的新一代浏览器才刚刚起步，尤其是浏览器负责运行JavaScript的引擎性能还可提升10倍。

先是Mozilla借助已壮烈牺牲的Netscape遗产在2002年推出了Firefox浏览器，紧接着Apple于2003年在开源的KHTML浏览器的基础上推出了WebKit内核的Safari浏览器，不过仅限于Mac平台。

随后，Google也开始创建自家的浏览器。他们也看中了WebKit内核，于是基于WebKit内核推出了Chrome浏览器。

添加网易云音乐

我们可以直接在网易云音乐中搜索我们想要插入的音乐，然后点击生成外链播放器

然后可以根据你得设置生成相应的html代码，将获得的html代码插入到你想要插入的位置即可

放在了layout/_macro/sidebar.swig 文件下

1
2
3
4

<div id="music163player">
    <iframe frameborder="no" border="0" marginwidth="0" marginheight="0" width=280 height=86 src="//music.163.com/outchain/player?type=2&id=38358214&auto=0&height=66">
    </iframe>
</div>

然后就可以在侧边栏看见我的播放器了~