Vue.js
文章平均质量分 95
程序媛-jjl
一日入计院,终身程序媛
展开
-
vue组件(二)--prop传递数据
组件组合组件设计初衷就是要配合使用的,最常见的就是形成父子组件的关系:组件 A 在它的模板中使用了组件 B。它们之间必然需要相互通信:父组件可能要给子组件下发数据,子组件则可能要将它内部发生的事情告知父组件。然而,通过一个良好定义的接口来尽可能将父子组件解耦也是很重要的。这保证了每个组件的代码可以在相对隔离的环境中书写和理解,从而提高了其可维护性和复用性。在 Vue 中,父子组件的原创 2017-12-26 16:16:36 · 9060 阅读 · 2 评论 -
vue-router: 路由传参
在设置路由规则时,我们可以给路径名设置一个别名,方便进行路由跳转,而不需要去记住过长的全路径。例如: routerTest1 Brand原创 2018-01-24 11:03:24 · 548 阅读 · 0 评论 -
vue2路由--嵌套路由
一般应用中的路由方式不会像上述例子那么简单,往往会出现二级导航这种情况。这时就需要使用嵌套路由这种写法。 routerTest1 Brand原创 2018-01-24 09:56:41 · 961 阅读 · 0 评论 -
vue2路由实例(基本用法)
Vue-router 是给Vue.js 提供路由管理的插件,利用hash 的变化控制动态组件的切换。以往页面间跳转都由后端MVC 中Controller 层控制,通过 标签的href 或者直接修改location.href,我们会向服务端发起一个请求,服务端响应后根据所接收到的信息去获取数据和指派对应的模板,渲染成HTML 再返回给浏览器,解析成我们可见的页面。Vue.js +Vue-router原创 2018-01-24 09:45:17 · 1319 阅读 · 0 评论 -
Vue.js--杂项
①组件和v-for简单来说,就是组件被多次复用; 例如表格里的某一行,又例如电商的商品橱窗展示(单个橱窗),都可以成为可以被复用的组件; 只要编写其中一个作为组件,然后使数据来源成为一个数组(或对象,但个人觉得最好是数组),通过v-for的遍历,组件的每个实例,都可以获取这个数组中的一项,从而生成全部的组件。 而数据传输,由于复用,所以需要使转载 2017-12-28 20:21:57 · 202 阅读 · 0 评论 -
vue——动态组件
通过使用保留的 元素,动态地绑定到它的 is 特性,我们让多个组件可以使用同一个挂载点,并动态切换。根据 v-bind:is="组件名" 中的组件名去自动匹配组件,如果匹配不到则不显示。改变挂载的组件,只需要修改is指令的值即可。Vue 测试实例 - 动态组件 点击显示子组件 // 创建根实例new Vue({ el: '#app', da原创 2017-12-27 19:38:13 · 22172 阅读 · 1 评论 -
vue——使用插槽分发内容
单个插槽除非子组件模板包含至少一个 插口,否则父组件的内容将会被丢弃。当子组件模板只有一个没有属性的插槽时,父组件传入的整个内容片段将插入到插槽所在的 DOM 位置,并替换掉插槽标签本身。最初在 标签中的任何内容都被视为备用内容。备用内容在子组件的作用域内编译,并且只有在宿主元素为空,且没有要插入的内容时才显示备用内容。例:Vue 测试实例 - 单个插槽原创 2017-12-27 16:15:08 · 1930 阅读 · 0 评论 -
vue.js 计算属性及计算属性(computed)、methods、watched三者区别
引入计算属性的原因:模板内的表达式非常便利,但是设计它们的初衷是用于简单运算的。在模板中放入太多的逻辑会让模板过重且难以维护。例如: {{ message.split('').reverse().join('') }}在上面的代码中,模板不再是简单的声明式逻辑。要看一段时间才知道这里想要显示变量message的翻转字符串。当在不同的地方引用此处的字符串的时候,就会显得很冗余,要是原创 2017-12-21 19:10:45 · 642 阅读 · 0 评论 -
vue——自定义事件
每个 Vue 实例都实现了事件接口,即:使用 $on(eventName) 监听事件使用 $emit(eventName) 触发事件另外,父组件可以在使用子组件的地方直接用 v-on 来监听子组件触发的事件[注意]不能用 $on 侦听子组件抛出的事件,而必须在模板里直接用 v-on 绑定请看下面的例子:Vue 测试实例 - 自定义事件原创 2017-12-27 14:20:50 · 301 阅读 · 0 评论 -
Spring+MyBatis 错误:org.mybatis.spring.MyBatisSystemException: nested exception is org.apache.ibatis.b
今天用SSM框架做一个项目的时候,在进行简单的测试,发现一个错误,而这个坑在我毕设的时候遇到一次忘记了,这回要记下来。 org.mybatis.spring.MyBatisSystemException: nested exception is org.apache.ibatis.binding.BindingException: Parameter 'groupName' notfou...原创 2017-12-20 18:18:33 · 9570 阅读 · 1 评论 -
Vue——Class和Style绑定
Class 与 Style 绑定操作元素的 class 列表和内联样式是数据绑定的一个常见需求。因为它们都是属性,所以我们可以用 v-bind 处理它们:只需要通过表达式计算出字符串结果即可。不过,字符串拼接麻烦且易错。因此,在将 v-bind 用于 class 和 style 时,Vue.js 做了专门的增强。表达式结果的类型除了字符串之外,还可以是对象或数组。绑定HTML原创 2017-12-21 09:24:15 · 495 阅读 · 0 评论 -
Vue---条件语句和循环语句(一)
条件语句原创 2017-12-21 13:13:11 · 3512 阅读 · 1 评论 -
Vue---条件语句和循环语句(二)
v-for 迭代数组我们用 v-for 指令根据一组数组的选项列表进行渲染。v-for 指令需要使用item in items 形式的特殊语法,items 是源数据数组并且 item 是数组元素迭代的别名。案例1Vue 测试实例 - v-for 迭代数组 {{ site.name }} new Vue({ e原创 2017-12-21 14:51:00 · 1636 阅读 · 0 评论 -
vue——两种方式实现列表动态添加和删除
下面将介绍两种方式实现动态添加和删除列表1.不使用组件Vue 测试实例 - vue实现列表增加和删除 添加 {{list.title}} 删除 var vm = new Vue({ el: '#app', data: { newAddText:'', lists:[ {id:1,title:'手机号码'},原创 2017-12-21 17:28:47 · 64188 阅读 · 7 评论 -
Vue表单及表单绑定
基础用法可以用 v-model 指令在表单 及 元素上创建双向数据绑定。它会根据控件类型自动选取正确的方法来更新元素。尽管有些神奇,但 v-model 本质上不过是语法糖。它负责监听用户的输入事件以更新数据,并对一些极端场景进行一些特殊处理。原创 2017-12-22 14:00:46 · 6930 阅读 · 0 评论 -
字符串模板和dom模板的区别
dom模板就是原先就写在页面上的,能被浏览器识别的 html 结构,会在一加载就被浏览器渲染,所以要遵循 html 结构和标签命名,不然是不会被浏览器解析的,也就获取不到内容了,接着js获取 dom 节点的内容,就形成了 dom 模板。模板字符串使用反引号 (` `) 来代替普通字符串中的用双引号和单引号。模板字符串可以包含特定语法(${expression})的占位符。占位符中的表达原创 2017-12-25 16:22:14 · 3576 阅读 · 0 评论 -
vue组件(一)——组件介绍
定义组件 (Component) 是 Vue.js 最强大的功能之一。组件可以扩展 HTML 元素,封装可重用的代码。在较高层面上,组件是自定义元素,Vue.js 的编译器为它添加特殊功能。在有些情况下,组件也可以表现为用 is 特性进行了扩展的原生 HTML 元素。所有的 Vue 组件同时也都是 Vue 的实例,所以可接受相同的选项对象 (除了一些根级特有的选项) 并提供相同的生命周原创 2017-12-22 16:50:42 · 7465 阅读 · 0 评论 -
vue.js 三种方式安装
Vue.js(读音 /vjuː/, 类似于 view)是一个构建数据驱动的 web 界面的渐进式框架。Vue.js 的目标是通过尽可能简单的 API 实现响应的数据绑定和组合的视图组件。它不仅易于上手,还便于与第三方库或既有项目整合。 下面介绍三种 Vue.js 的安装方法: 1.独立版本 我们可以在Vue.js的官网上直接下载......原创 2017-12-18 20:17:18 · 221183 阅读 · 22 评论