Login
Discover
Waves
Communities
Login
Signup
lemooljiang
@lemooljiang
75
Designer , Poet , Technology enthusiasts
Followers
2368
Following
95
Follow
Resource Credits
Available
Used
Location
Guangzhou
Created
2016-07-16 04:39
RSS Feed
Subscribe
Comments
Blog
Posts
Comments
Communities
Wallet
lemooljiang
starnote
2020-01-18 07:58
RE: Vue.js实战笔记
<button @click='jumpto'> 点击跳转 </button> <script> methods: { jumpto (){ this.$router.push('/cart') //this.$router.push({path: '/cart'}) //this.$router.push({path: '/cart' + id}) } }
$ 0.000
1
lemooljiang
starnote
2020-01-18 07:58
RE: Vue.js实战笔记
<div id="app"> <router-link :to="{name: 'login'}">login</router-link> <router-link :to="{name: 'login',params:{id:10}}">login</router-link> //传参的形式
$ 0.000
0
lemooljiang
starnote
2020-01-18 07:57
RE: Vue.js实战笔记
(name指定组件名)，多个组件布置 <div id="app"> <router-view></router-view> <router-view name="left"></router-view> <router-view
lemooljiang
starnote
2020-01-18 07:56
RE: Vue.js实战笔记
<div id="app"> <router-link to="/login">login</router-link> <router-link to="/register">register</router-link>
lemooljiang
starnote
2020-01-18 07:55
RE: Vue.js实战笔记
// 一个案例：文章列表到文章详情页 //注意：+ 号之间不能有空格！！它是绑定变量的，有空格的话会被加入 <router-link :to="'/article/'+post.permlink">{{ post.title }}</router-link> //router.js path: '/article/:permlink' //article.vue
lemooljiang
starnote
2020-01-18 04:38
RE: Vue.js实战笔记
//app.vue <style> //用这个类 .router-link-exact-active{ color:red; border-bottom: 1px solid red; } .router-link-active{ color:red; } </style>
lemooljiang
starnote
2020-01-18 04:37
RE: Vue.js实战笔记
vue-router文档 新版的vue中路由默认就是history模式（即url中没有# ,hash模式才有） cnpm install vue-router --save //使用，比如App.vue <div id="app"> <router-link to="/login">login</router-link>
lemooljiang
starnote
2020-01-18 04:16
RE: Vue.js实战笔记
这也是调用子组件的方法 <input type="button" value="调用" @click="getElement"> <h3 ref="myh3">天天这样</h3> getElement: function () {
lemooljiang
starnote
2020-01-18 04:14
RE: Vue.js实战笔记
主要是通过 $refs 获取子组件对象 绑定属性 获取子组件对象 //Test.vue data(){ return { str:'', sonmsg: '这是子数据' } }, // App.vue <Test ref="sonmsg"></Test> // 1. 绑定属性 mounted() { console.log(566,
lemooljiang
starnote
2020-01-18 04:13
RE: Vue.js实战笔记
直接在子组件中使用 this.$parent 即可获取父组件对象。 这种方法比较简单，但是不太直观，建议使用上一种方法。
lemooljiang
starnote
2020-01-18 04:12
RE: Vue.js实战笔记
分两步走: 在父组件中动态绑定属性，:parentmsg='msg' 子组件中通过 props: 获取。 传方法也是差不多步骤. //App.vue传值给Header.vue //App.vue中的写法 <template> <div id="app"> <Header :parentmsg="title"
lemooljiang
starnote
2020-01-18 03:47
RE: Vue.js实战笔记
axios中文文档 参考 参考2 cnpm install axios --save //main.js import axios from 'axios' Vue.prototype.axios = axios //其它js中使用： this.axios({......}) //或者是哪里使用哪里就导入： import axios from 'axios' axios.get(){}
lemooljiang
starnote
2020-01-18 03:42
RE: Vue.js实战笔记
<template> <div id="app"> <router-link to="/index">首页</router-link> <router-link to="/course">课程</router-link> <router-link
lemooljiang
starnote
2020-01-18 03:39
RE: Vue.js实战笔记
主要是在 App.vue 中布局。 主要分三步：引入，注册及使用。 <template> <div id="app"> <Header></Header> //3.使用 <Banner></Banner> </div> </template> <script> import
lemooljiang
starnote
2020-01-18 03:13
RE: Vue.js实战笔记
lemooljiang
starnote
2020-01-18 03:12
RE: Vue.js实战笔记
手册 参考 cnpm install bootstrap-vue bootstrap --save //src/main.js import BootstrapVue from 'bootstrap-vue' import 'bootstrap/dist/css/bootstrap.css' import 'bootstrap-vue/dist/bootstrap-vue.css'
lemooljiang
starnote
2020-01-18 03:08
RE: Vue.js实战笔记
@keyup.enter='function' .enter //监听enter键 .tab
lemooljiang
starnote
2020-01-18 03:03
RE: Vue.js实战笔记
.stop @click.stop='show' //可以阻止事件冒泡 .prevent //阻止默认行为 .capture //捕获触发事件 .self //只有点击当前元素才触发 .once //只触发一次
lemooljiang
starnote
2020-01-18 03:01
RE: Vue.js实战笔记
1. 数组 <h1 :class="['first', 'second']">hello</h1> 2. 三元表达式 <h1 :class="['first', 'second',flag?'active':'']"> 3. 类名 <h1 :class="['first', 'second', { 'active':flag
lemooljiang
starnote
2020-01-18 03:00
RE: Vue.js实战笔记
1、v-cloak 解决插值表达式的闪烁问题，后面不再需要 <p v-cloak>{{ msg }}</p> [v-cloak]{ display: none; } 2、<p v-text='msg'></p> // 渲染文本内容，会替换整个文本，所以一般使用插值表达式{{ msg }} 3、<p
← Latest
Older →
