vue

第一节

vue:
读音: v-u-e
view

vue到底是什么?
    一个mvvm框架(库)、和angular类似
    比较容易上手、小巧
mvc:
    mvp
    mvvm
    mv*
    mvx
官网:http://cn.vuejs.org/ 
手册： http://cn.vuejs.org/api/

vue和angular区别?
vue——简单、易学
指令以 v-xxx
一片html代码配合上json，在new出来vue实例
个人维护项目

vue基本雏形:
vue:
html:

        <div id="box">
            {{msg}}
        </div>
        var c=new Vue({
            el:'#box',  //选择器  class tagName
            data:{
                msg:'welcome vue'
            }
        });

常用指令:
指令: 扩展html标签功能,属性

v-model 一般表单元素(input)   双向数据绑定

循环:
    v-for="name in arr"
        {{$index}}

    v-for="name in json"
        {{$index}}  {{$key}}

    v-for="(k,v) in json"
事件:
    v-on:click="函数"

    v-on:click/mouseout/mouseover/dblclick/mousedown.....

    new Vue({
        el:'#box',
        data:{ //数据
            arr:['apple','banana','orange','pear'],
            json:{a:'apple',b:'banana',c:'orange'}
        },
        methods:{
            show:function(){    //方法
                alert(1);
            }
        }
    });
显示隐藏:
    v-show=“true/false”

bootstrap+vue简易留言板(todolist):

bootstrap: css框架    跟jqueryMobile一样
    只需要给标签 赋予class，角色
    依赖jquery

确认删除？和确认删除全部么?

事件:
v-on:click/mouseover......

简写的:
@click=""       推荐

事件对象:
    @click="show($event)"
事件冒泡:
    阻止冒泡:  
        a). ev.cancelBubble=true;
        b). @click.stop 推荐
默认行为(默认事件):
    阻止默认行为:
        a). ev.preventDefault();
        b). @contextmenu.prevent    推荐
键盘:
    @keydown    $event  ev.keyCode
    @keyup

    常用键:
        回车
            a). @keyup.13
            b). @keyup.enter
        上、下、左、右
            @keyup/keydown.left
            @keyup/keydown.right
            @keyup/keydown.up
            @keyup/keydown.down
        .....

属性:
v-bind:src=""
width/height/title....

简写:
:src="" 推荐

<img src="{{url}}" alt="">  效果能出来，但是会报一个404错误
<img v-bind:src="url" alt="">   效果可以出来，不会发404请求

class和style: 数组用的是数据，对象用的是属性
:class="" v-bind:class=""
:style="" v-bind:style=""

:class="[red]"  red是数据
:class="[red,b,c,d]"

:class="{red:a, blue:false}"

:class="json"
    
    data:{
        json:{red:a, blue:false}
    }
--------------------------
style:
:style="[c]"
:style="[c,d]"
    注意:  复合样式，采用驼峰命名法
:style="json"

模板:
{{msg}} 数据更新模板变化
{{*msg}} 数据只绑定一次

{{{msg}}}   HTML转意输出

过滤器:-> 过滤模板数据
系统提供一些过滤器:

{{msg| filterA}}
{{msg| filterA | filterB}}

uppercase   eg: {{'welcome'| uppercase}}
lowercase
capitalize

currency    钱

{{msg| filterA 参数}}

....

交互:
$http （ajax）

如果vue想做交互

引入: vue-resouce

get:
    获取一个普通文本数据:
    this.$http.get('aa.txt').then(function(res){
        alert(res.data);
    },function(res){
        alert(res.status);
    });
    给服务发送数据:√
    this.$http.get('get.php',{
        a:1,
        b:2
    }).then(function(res){
        alert(res.data);
    },function(res){
        alert(res.status);
    });
post:
    this.$http.post('post.php',{
        a:1,
        b:20
    },{
        emulateJSON:true
    }).then(function(res){
        alert(res.data);
    },function(res){
        alert(res.status);
    });
jsonp:
    https://sug.so.360.cn/suggest?callback=suggest_so&word=a

    https://sp0.baidu.com/5a1Fazu8AA54nxGko9WTAnF6hhy/su?wd=a&cb=jshow

    this.$http.jsonp('https://sp0.baidu.com/5a1Fazu8AA54nxGko9WTAnF6hhy/su',{
        wd:'a'
    },{
        jsonp:'cb'  //callback名字，默认名字就是"callback"
    }).then(function(res){
        alert(res.data.s);
    },function(res){
        alert(res.status);
    });

https://www.baidu.com/s?wd=s

第二节

vue制作weibo
交互

vue-> 1.0
vue-resource ajax php
服务器环境(node)

this.$http.get()/post()/jsonp()

this.$http({
    url:地址
    data:给后台提交数据,
    method:'get'/post/jsonp
    jsonp:'cb' //cbName
});

vue事件:
@click=""
数据:

添加一条留言：

获取某一页数据:
getPageData(1);

vue生命周期:
钩子函数:

created ->   实例已经创建 √
beforeCompile   ->   编译之前
compiled    ->   编译之后
ready       ->   插入到文档中 √

beforeDestroy   ->   销毁之前
destroyed   ->   销毁之后

用户会看到花括号标记:

v-cloak     防止闪烁, 比较大段落

<span>{{msg}}</span> -> v-text
{{{msg}}} -> v-html

ng: scope.watch

计算属性的使用:
computed:{
b:function(){ //默认调用get
return 值
}
}
--------------------------
computed:{
b:{
get:
set:
}
}

* computed里面可以放置一些业务逻辑代码，一定记得return

vue实例简单方法:
vm.el -> 就是元素 vm.data -> 就是data
vm.$mount -> 手动挂在vue程序

vm.$options ->   获取自定义属性
vm.$destroy ->   销毁对象

vm.$log();  ->  查看现在数据的状态

循环：
v-for="value in data"

会有重复数据？
track-by='索引'   提高循环性能

track-by='$index/uid'

过滤器:
vue提供过滤器:
capitalize uppercase currency....

    debounce    配合事件，延迟执行
数据配合使用过滤器:
    limitBy 限制几个
    limitBy 参数(取几个)
    limitBy 取几个  从哪开始

    filterBy    过滤数据
    filterBy ‘谁’

    orderBy 排序
    orderBy 谁 1/-1
        1  -> 正序
        2  -> 倒序

自定义过滤器:  model ->过滤 -> view
    Vue.filter(name,function(input){
        
    });

时间转化器
过滤html标记

双向过滤器:*
Vue.filter('filterHtml',{
            read:function(input){ //model-view
                return input.replace(/<[^<+]>/g,'');
            },
            write:function(val){ //view -> model
                return val;
            }
});

数据 -> 视图
model -> view

view -> model

v-text
v-for
v-html
指令: 扩展html语法

自定义指令:
属性:

Vue.directive(指令名称,function(参数){
    this.el -> 原生DOM元素
});

<div v-red="参数"></div>

指令名称:   v-red  ->  red

* 注意: 必须以 v-开头

拖拽:
-------------------------------

自定义元素指令:（用处不大）
Vue.elementDirective('zns-red',{
bind:function(){
this.el.style.background='red';
}
});

@keydown.up
@keydown.enter

@keydown.a/b/c....

自定义键盘信息:
Vue.directive('on').keyCodes.ctrl=17;
Vue.directive('on').keyCodes.myenter=13;

监听数据变化:
vm.el/mount/$options/....

vm.$watch(name,fnCb);  //浅度
vm.$watch(name,fnCb,{deep:true});  //深度监视

vue组件:
组件间各种通信
slot
vue-loader webpack .vue
vue-router

第三节

git page：
任何仓库 master分支，都可以发布(git page)

双向过滤器:
Vue.filter(name,{
read:
write:
});

1.0
2.0

引入 vue.js
bower-> （前端）包管理器
npm install bower -g
验证: bower --version
bower install <包名>
bower uninstall <包名>
bower info <包名> 查看包版本信息
<script src="bower_components/vue/dist/vue.js"></script>

vue-> 过渡(动画)
本质走的css3: transtion ,animation

<div id="div1" v-show="bSign" transition="fade"></div>

动画:
    .fade-transition{
        
    }
    进入：
    .fade-enter{
        opacity: 0;
    }
    离开：
    .fade-leave{
        opacity: 0;
        transform: translateX(200px);
    }
----------------------------------------

vue组件:
组件: 一个大对象
定义一个组件:

  1. 全局组件
    var Aaa=Vue.extend({
    template:'<h3>我是标题3</h3>'
    });

Vue.component('aaa',Aaa);

*组件里面放数据:
    data必须是函数的形式，函数必须返回一个对象(json)
  1. 局部组件
    放到某个组件内部
    var vm=new Vue({
    el:'#box',
    data:{
    bSign:true
    },
    components:{ //局部组件
    aaa:Aaa
    }
    });

另一种编写方式:
Vue.component('my-aaa',{
template:'<strong>好</strong>'
});

var vm=new Vue({
    el:'#box',
    components:{
        'my-aaa':{
            template:'<h2>标题2</h2>'
        }
    }
});

配合模板:
1. template:'<h2 @click="change">标题2->{{msg}}</h2>'

2. 单独放到某个地方
    a). <script type="x-template" id="aaa">
        <h2 @click="change">标题2->{{msg}}</h2>
    </script>
    b). <template id="aaa">
        <h1>标题1</h1>
        <ul>
            <li v-for="val in arr">
                {{val}}
            </li>
        </ul>
    </template>

动态组件:
<component :is="组件名称"></component>

vue-devtools -> 调试工具
https://chrome.google.com/webstore/detail/vuejs-devtools/nhdogjmejiglipccpnnnanhbledajbpd

vue默认情况下，子组件也没法访问父组件数据

组件数据传递: √

  1. 子组件就想获取父组件data
    在调用子组件：
    <bbb :m="数据"></bbb>

    子组件之内:
    props:['m','myMsg']

     props:{
     'm':String,
     'myMsg':Number
 }

  2. 父级获取子级数据
    *子组件把自己的数据，发送到父级

    vm.$emit(事件名,数据);

    v-on: @

vm.dispatch(事件名,数据) 子级向父级发送数据 vm.broadcast(事件名,数据) 父级向子级广播数据
配合: event:{}

在vue2.0里面已经，报废了

slot:
位置、槽口
作用: 占个位置

类似ng里面 transclude  （指令）

vue-> SPA应用，单页面应用
vue-resouce 交互
vue-router 路由

根据不同url地址，出现不同效果

咱上课: 0.7.13

主页 home
新闻页 news

html:
<a v-link="{path:'/home'}">主页</a> 跳转链接

展示内容:
<router-view></router-view>

js:
//1. 准备一个根组件
var App=Vue.extend();

//2. Home News组件都准备
var Home=Vue.extend({
    template:'<h3>我是主页</h3>'
});

var News=Vue.extend({
    template:'<h3>我是新闻</h3>'
});

//3. 准备路由
var router=new VueRouter();

//4. 关联
router.map({
    'home':{
        component:Home
    },
    'news':{
        component:News
    }
});

//5. 启动路由
router.start(App,'#box');

跳转:
router.redirect({
‘/’:'/home'
});

路由嵌套(多层路由):

主页  home
    登录  home/login
    注册  home/reg
新闻页 news

subRoutes:{
    'login':{
        component:{
            template:'<strong>我是登录信息</strong>'
        }
    },
    'reg':{
        component:{
            template:'<strong>我是注册信息</strong>'
        }
    }
}

路由其他信息:
/detail/:id/age/:age

{{$route.params | json}}    ->  当前参数

{{$route.path}} ->  当前路径

{{$route.query | json}} ->  数据

vue-loader:
其他loader -> css-loader、url-loader、html-loader.....

后台: nodeJs  ->  require  exports
broserify  模块加载，只能加载js
webpack   模块加载器， 一切东西都是模块, 最后打包到一块了

require('style.css');   ->   css-loader、style-loader


vue-loader基于webpack

.css
.js
.html
.php
.....

a.vue
b.vue

.vue文件:
    放置的是vue组件代码

    <template>
        html
    </template>

    <style>
        css
    </style>

    <script>
        js  （平时代码、ES6）  babel-loader
    </script>

简单的目录结构:
|-index.html
|-main.js 入口文件
|-App.vue vue文件，官方推荐命名法
|-package.json 工程文件(项目依赖、名称、配置)
npm init --yes 生成
|-webpack.config.js webpack配置文件

ES6: 模块化开发
导出模块：
export default {}
引入模块:
import 模块名 from 地址

webpak准备工作:
cnpm install webpack --save-dev
cnpm install webpack-dev-server --save-dev

App.vue -> 变成正常代码       vue-loader@8.5.4
cnpm install vue-loader@8.5.4 --save-dev

cnpm install vue-html-loader --save-dev

vue-html-loader、css-loader、vue-style-loader、
vue-hot-reload-api@1.3.2

babel-loader
babel-core
babel-plugin-transform-runtime
babel-preset-es2015
babel-runtime

第四节

手动配置自己:
webpack+vue-loader

webpack加载模块

如何运行此项目？
1. npm install 或者 cnpm install
2. npm run dev
-> package.json
"scripts":{
"dev":"webpack-dev-server --inline --hot --port 8082"
}

以后下载模块：
npm install <package-name> --save-dev

EADDRINUSE 端口被占用

少了:
webpack-dev-server
webpack

.vue 结尾，之后称呼组件
路由:
vue-router
-> 如何查看版本:bower info vue-router
路由使用版本: 0.7.13

配合vue-loader使用:

  1. 下载vue-router模块
    cnpm install vue-router@0.7.13
  2. import VueRouter from 'vue-router'
  3. Vue.use(VueRouter);
  4. 配置路由
    var router=new VueRouter();
    router.map({
    路由规则
    })
  5. 开启
    router.start(App,'#app');

注意:
之前: index.html -> <app></app>
现在: index.html -> <div id="app"></div>

App.vue ->   需要一个 <div id="app"></div>  根元素

home news

路由嵌套:
和之前一模一样

上线:
npm run build
-> webpack -p

脚手架:
vue-cli——vue脚手架
帮你提供好基本项目结构

本身集成很多项目模板:
simple 个人觉得一点用都没有
webpack 可以使用(大型项目)
Eslint 检查代码规范，
单元测试
webpack-simple 个人推荐使用, 没有代码检查 √

browserify  ->  自己看
browserify-simple

基本使用流程:

  1. npm install vue-cli -g 安装 vue命令环境
    验证安装ok?
    vue --version
  2. 生成项目模板
    vue init <模板名> 本地文件夹名称
  3. 进入到生成目录里面
    cd xxx
    npm install
  4. npm run dev

第五节：vue2.0

vue2.0:
bower info vue

http://vuejs.org/

到了2.0以后，有哪些变化?

  1. 在每个组件模板，不在支持片段代码
    组件中模板:
    之前:
    <template>
    <h3>我是组件</h3><strong>我是加粗标签</strong>
    </template>
    现在: 必须有根元素，包裹住所有的代码
    <template id="aaa">
    <div>
    <h3>我是组件</h3>
    <strong>我是加粗标签</strong>
    </div>
    </template>

  2. 关于组件定义
    Vue.extend 这种方式，在2.0里面有，但是有一些改动，这种写法，即使能用，咱也不用——废弃

    Vue.component(组件名称,{ 在2.0继续能用
    data(){}
    methods:{}
    template:
    });

    2.0推出一个组件，简洁定义方式：
    var Home={
    template:'' -> Vue.extend()
    };

  3. 生命周期
    之前:
    init
    created
    beforeCompile
    compiled
    ready √ -> mounted
    beforeDestroy
    destroyed
    现在:
    beforeCreate 组件实例刚刚被创建,属性都没有
    created 实例已经创建完成，属性已经绑定
    beforeMount 模板编译之前
    mounted 模板编译之后，代替之前ready *
    beforeUpdate 组件更新之前
    updated 组件更新完毕 *
    beforeDestroy 组件销毁前
    destroyed 组件销毁后

  4. 循环
    2.0里面默认就可以添加重复数据

    arr.forEach(function(item,index){

    });

    去掉了隐式一些变量
    indexkey

    之前:
    v-for="(index,val) in array"
    现在:
    v-for="(val,index) in array"

  1. track-by="id"
    变成
    <li v-for="(val,index) in list" :key="index">

  2. 自定义键盘指令
    之前：Vue.directive('on').keyCodes.f1=17;

    现在: Vue.config.keyCodes.ctrl=17

  3. 过滤器
    之前:
    系统就自带很多过滤
    {{msg | currency}}
    {{msg | json}}
    ....
    limitBy
    filterBy
    .....
    一些简单功能，自己通过js实现

    到了2.0， 内置过滤器，全部删除了

lodash  工具库 _.debounce(fn,200)


自定义过滤器——还有
    但是,自定义过滤器传参

    之前: {{msg | toDou '12' '5'}}
    现在:     {{msg | toDou('12','5')}}

组件通信:
vm.emit() vm.on();

父组件和子组件:

子组件想要拿到父组件数据:
    通过  props

之前，子组件可以更改父组件信息，可以是同步  sync
现在，不允许直接给父级的数据，做赋值操作

问题，就想更改：
    a). 父组件每次传一个对象给子组件, 对象之间引用  √
    b). 只是不报错, mounted中转

可以单一事件管理组件通信: vuex
var Event=new Vue();

Event.$emit(事件名称, 数据)

Event.$on(事件名称,function(data){
    //data
}.bind(this));

debounce 废弃
-> lodash
_.debounce(fn,时间)

第六节

vue动画
vue路由

transition 之前 属性
<p transition="fade"></p>

.fade-transition{}
.fade-enter{}
.fade-leave{}

到2.0以后 transition 组件

<transition name="fade">
运动东西(元素，属性、路由....)
</transition>

class定义:
.fade-enter{} //初始状态
.fade-enter-active{} //变化成什么样 -> 当元素出来(显示)

.fade-leave{}
.fade-leave-active{} //变成成什么样 -> 当元素离开(消失)

如何animate.css配合用？
<transition enter-active-class="animated zoomInLeft" leave-active-class="animated zoomOutRight">
<p v-show="show"></p>
</transition>

多个元素运动:
<transition-group enter-active-class="" leave-active-class="">
<p :key=""></p>
<p :key=""></p>
</transition-group>

vue2.0 路由:
http://router.vuejs.org/zh-cn/index.html
基本使用:

  1. 布局
    <router-link to="/home">主页</router-link>

    <router-view></router-view>

  2. 路由具体写法
    //组件
    var Home={
    template:'<h3>我是主页</h3>'
    };
    var News={
    template:'<h3>我是新闻</h3>'
    };

    //配置路由
    const routes=[
    {path:'/home', componet:Home},
    {path:'/news', componet:News},
    ];

    //生成路由实例
    const router=new VueRouter({
    routes
    });

    //最后挂到vue上
    new Vue({
    router,
    el:'#box'
    });

  3. 重定向
    之前 router.rediect 废弃了
    {path:'*', redirect:'/home'}

路由嵌套:
/user/username

const routes=[
    {path:'/home', component:Home},
    {
        path:'/user',
        component:User,
        children:[  //核心
            {path:'username', component:UserDetail}
        ]
    },
    {path:'*', redirect:'/home'}  //404
];

/user/strive/age/10

:id
:username
:age

路由实例方法:
router.push({path:'home'}); //直接添加一个路由,表现切换路由，本质往历史记录里面添加一个
router.replace({path:'news'}) //替换路由，不会往历史记录里面添加

vue-cli

npm install

脚手架: vue-loader
1.0 ->
new Vue({
el: '#app',
components:{App}
})
2.0->
new Vue({
el: '#app',
render: h => h(App)
})

vue2.0
vue-loader和vue-router配合

style-loader css-loader

style!css

项目:

第七节

vue问题:
论坛
http://bbs.zhinengshe.com

UI组件
别人提供好一堆东西

目的: 
    为了提高开发效率
    功能

原则: 拿过来直接使用

vue-cli -> vue-loader

bootstrap:
twitter 开源
简洁、大方
官网文档

基于 jquery

栅格化系统+响应式工具  (移动端、pad、pc)
按钮

bower 前端包管理器 jquery#1.11.1
自动解决依赖
npm node包管理器 jquery@1.11.1

饿了么团队开源一个基于vue 组件库
elementUI PC
MintUI 移动端

elementUI:
如何使用

官网:http://element.eleme.io/

使用:

  1. 安装 element-ui
    npm i element-ui -D

    npm install element-ui --save-dev

    // i -> install
    // D -> --save-dev
    // S -> --save

  2. 引入 main.js 入口文件
    import ElementUI from 'element-ui'
    import 'element-ui/lib/theme-default/index.css'

    全部引入

  3. 使用组件
    Vue.use(ElementUI)

    css-loader 引入css
    字体图标 file-loader

less:
    less
    less-loader

按需加载相应组件: √
就需要 按钮

  1. babel-plugin-component
    cnpm install babel-plugin-component -D
  2. .babelrc文件里面新增一个配置
    "plugins": [["component", [
    {
    "libraryName": "element-ui",
    "styleLibraryName": "theme-default"
    }
    ]]]
  3. 想用哪个组件就用哪个
    引入:
    import {Button,Radio} from 'element-ui'
    使用:
    a). Vue.component(Button.name, Button); 个人不太喜欢
    b). Vue.use(Button); √

发送请求:
vue-resourse 交互

axios

element-ui -> pc

mint-ui
移动端 ui库

http://mint-ui.github.io/

  1. 下载
    npm install mint-ui -S

    -S
    --save

  2. 引入
    import Vue from 'vue';
    import Mint from 'mint-ui';
    import 'mint-ui/lib/style.css'
    Vue.use(Mint);

    按需引入:
    import { Cell, Checklist } from 'minu-ui';
    Vue.component(Cell.name, Cell);
    Vue.component(Checklist.name, Checklist);

http://mint-ui.github.io/docs/#!/zh-cn2

论坛:

Mint-ui-demo: 看着手册走了一遍

https://github.com/itstrive/striveCode/tree/js/vue2.0-Mint-ui-demo

最后编辑于 ：
©著作权归作者所有,转载或内容合作请联系作者
  • 人面猴
    序言：七十年代末，一起剥皮案震惊了整个滨河市，随后出现的几起案子，更是在滨河造成了极大的恐慌，老刑警刘岩，带你破解...
    沈念sama阅读 206,968评论 6赞 482
  • 死咒
    序言：滨河连续发生了三起死亡事件，死亡现场离奇诡异，居然都是意外死亡，警方通过查阅死者的电脑和手机，发现死者居然都...
    沈念sama阅读 88,601评论 2赞 382
  • 救了他两次的神仙让他今天三更去死
    文/潘晓璐 我一进店门，熙熙楼的掌柜王于贵愁眉苦脸地迎上来，“玉大人，你说我怎么就摊上这事。” “怎么了？”我有些...
    开封第一讲书人阅读 153,220评论 0赞 344
  • 道士缉凶录：失踪的卖姜人
    文/不坏的土叔 我叫张陵，是天一观的道长。 经常有香客问我，道长，这世上最难降的妖魔是什么？ 我笑而不...
    开封第一讲书人阅读 55,416评论 1赞 279
  • 港岛之恋（遗憾婚礼）
    正文 为了忘掉前任，我火速办了婚礼，结果婚礼上，老公的妹妹穿的比我还像新娘。我一直安慰自己，他们只是感情好，可当我...
    茶点故事阅读 64,425评论 5赞 374
  • 恶毒庶女顶嫁案：这布局不是一般人想出来的
    文/花漫 我一把揭开白布。 她就那样静静地躺着，像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上，一...
    开封第一讲书人阅读 49,144评论 1赞 285
  • 城市分裂传说
    那天，我揣着相机与录音，去河边找鬼。 笑死，一个胖子当着我的面吹牛，可吹牛的内容都是我干的。 我是一名探鬼主播，决...
    沈念sama阅读 38,432评论 3赞 401
  • 双鸳鸯连环套：你想象不到人心有多黑
    文/苍兰香墨 我猛地睁开眼，长吁一口气：“原来是场噩梦啊……” “哼！你这毒妇竟也来了？” 一声冷哼从身侧响起，我...
    开封第一讲书人阅读 37,088评论 0赞 261
  • 万荣杀人案实录
    序言：老挝万荣一对情侣失踪，失踪者是张志新（化名）和其女友刘颖，没想到半个月后，有当地人在树林里发现了一具尸体，经...
    沈念sama阅读 43,586评论 1赞 300
  • 护林员之死
    正文 独居荒郊野岭守林人离奇死亡，尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 36,028评论 2赞 325
  • 白月光启示录
    正文 我和宋清朗相恋三年，在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 38,137评论 1赞 334
  • 活死人
    序言：一个原本活蹦乱跳的男人离奇死亡，死状恐怖，灵堂内的尸体忽然破棺而出，到底是诈尸还是另有隐情，我是刑警宁泽，带...
    沈念sama阅读 33,783评论 4赞 324
  • 日本核电站爆炸内幕
    正文 年R本政府宣布，位于F岛的核电站，受9级特大地震影响，放射性物质发生泄漏。R本人自食恶果不足惜，却给世界环境...
    茶点故事阅读 39,343评论 3赞 307
  • 男人毒药：我在死后第九天来索命
    文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹，春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 30,333评论 0赞 19
  • 一桩弑父案，背后竟有这般阴谋
    文/苍兰香墨 我抬头看了看天上的太阳。三九已至，却和暖如春，着一层夹袄步出监牢的瞬间，已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 31,559评论 1赞 262
  • 情欲美人皮
    我被黑心中介骗来泰国打工， 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留，地道东北人。 一个月前我还...
    沈念sama阅读 45,595评论 2赞 355
  • 代替公主和亲
    正文 我出身青楼，却偏偏与公主长得像，于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子，可洞房花烛夜当晚...
    茶点故事阅读 42,901评论 2赞 345