在computed里新声明了一个对象sortItems,如果不重新声明会污染原来的数据源,这是Vue不允许的,所以你要重新声明一个对象。 如果不重新声明报错:
<!DOCTYPE html>
<html lang="en"> <head>
<meta charset="UTF-8">
<script type="text/javascript" src="vue2.2.js"></script>
<title>V-for 案例</title>
</head> <body>
<h1>v-for指令用法</h1>
<hr>
<div id="app">
<ul>
<li v-for="item in sortItems">
{{item}}
</li>
</ul>
</div>
<script type="text/javascript">
var app = new Vue({
el: '#app',
data: {
items:[20,23,18,65,32,19,54,41]
},
computed: {
sortItems: function() {
return this.items.sort(sortNumber);
}
}
});
function sortNumber(a,b) {
return a - b
}
</script>
</body> </html>

vue2.0排序应该注意的问题的更多相关文章

  1. vue2.0实践的一些细节

    最近用vue2.0做了个活动.做完了回头发现,好像并没有太多的技术难点,而自己好像又做了比较久...只能说效率有待提升啊...简单总结了一些比较细节的点. 1.对于一些已知肯定会有数据的模块,先用一个 ...

  2. 初学VUE2.0

    初学VUE2.0 (个人笔记,写完后发现好乱....下期使用markdown书写.) 概述 webstorm添加对VUE的支持 http://www.jianshu.com/p/142dae4f8b5 ...

  3. 《Vue2.0 实践揭秘》终于出版啦!

    不知不觉间在园子开博都两年多了,最近一些园友问最近去哪了为何都没有新的文章了.最近确实发生了很多的事,一是忙工作二就是忙着写书.这还得多些园子的小编,自两年前发表的"架构师修炼"系 ...

  4. vue2.0自学笔记

    前言: 一.优点: 轻量级.高效率.上手快.简单易学.文档全面而简洁 二.功能: 1.模板渲染 2.模块化 3.扩展功能:路由.Ajax 三.课程包含: 1.Vue实例 2.Vue组件 3.Vue指令 ...

  5. 重开Vue2.0

    目录: 内容: 一.Vue内部指令: 1.v-if v-else&v-show v-if与v-show都是选择性显示内容的指令,但是二者之间有区别: 1.v-if:判断是否加载,在需要的时候加 ...

  6. Vue2.0+组件库总结

    转自:https://blog.csdn.net/lishanleilixin/article/details/84025459 UI组件 element - 饿了么出品的Vue2的web UI工具套 ...

  7. 转:Vue2.0+组件库总结

    UI组件 element - 饿了么出品的Vue2的web UI工具套件 Vux - 基于Vue和WeUI的组件库 mint-ui - Vue 2的移动UI元素 iview - 基于 Vuejs 的开 ...

  8. Vue2.0+ElementUI+PageHelper实现的表格分页

    Vue2.0+ElementUI+PageHelper实现的表格分页 前言 最近做了一些前端的项目,要对表格进行一些分页显示.表格分页的方法有很多,从宏观上来说分为物理分页和逻辑分页,由于逻辑分页(即 ...

  9. VUE2.0学习总结

    摘要: 年后公司项目开始上vue2.0,自己对学习进行了总结,希望对大家有帮助! VUE2.0学习 vue介绍 vue是什么? https://vuefe.cn/guide vue也是一个数据驱动框架 ...

随机推荐

  1. Codeforces 768 E. Game of Stones 博弈DP

    E. Game of Stones   Sam has been teaching Jon the Game of Stones to sharpen his mind and help him de ...

  2. Koa2学习(八)使用session

    Koa2学习(八)使用session koa2框架不提供session的处理方法,这里我们需要借助一个第三方中间件koa-session来处理session. 先安装插件: $ npm i koa-s ...

  3. Java正则表达式的用法

    /** * 校验时间格式,正确则返回true * @param xxx * @return */ private static boolean checkDateFormat (String xxx) ...

  4. java 防止表单重复提交(serlvet)

    java 防止表单重复提交 ---------FormServlet.java-------------- protected void doGet(HttpServletRequest reques ...

  5. web前端技术社区分享

    web前端技术社区分享 一.国外的前端技术网站:    1. 名称:W3C: 网址:http://www.w3.org/ 理由:前端技术的规范标准几乎都是W3C制定的  2.名称:ECMA 网址:ht ...

  6. I.MX6 Android shutdown shell command

    /******************************************************************************* * I.MX6 Android shu ...

  7. 【bug】uc浏览器qq浏览器广告过滤

  8. Watir: Get document detail information in Watir.

    ie.#{element}(:id,"foo").document.currentstyle.attributeAsCamelCase so ie.#{element}(:id,& ...

  9. 【135】NoteExpress使用中的问题

    NoteExpress主要是用来管理文献,然后可以方便管理,方便插入,各种方便吧! 关于NoteExpress的下载可以直接搜索进入官网下载,为了不用破解之类的,可以选择大学版的! 引文显示上标!ht ...

  10. Xenocode Postbuild 2010 for .NET 使用

    代码混淆工具 参考地址1:http://blog.csdn.net/yanpingsoft/article/details/7997212 参考地址2:http://www.cnblogs.com/w ...