Havanao-优快云博客

原创 vue 按钮固定在屏幕下方中间位置

style.css{ position: fixed; left: 0; right: 0; bottom: 10px; }

2020-09-24 08:52:14 4134

原创 vue 用v-show，点击显示和隐藏

<template> <div class="container"> <button @click="clicktrue">btn</button> <div class="show1" v-show="show1"> show1 </div> <div class="show2" v-show="show2"> show2 </div></div></temp

2020-09-24 08:31:53 9607 2

apiapi>index.jsimport request from '@/utils/request'export const 接口名= (data) => { return request('后台接口路径','get')}文件名.vue<template> <div class="container"> <p>{{this.onething}}</p>//接口调用后引用的地方 </div></

2020-09-23 18:31:00 291

原创路由传参加密

proDetail(res){ var obj = { proid: res.proid//传的id }; var res = this.$Utils.demoRequest(JSON.stringify(obj)); this.$router.push({ path:'/',//跳转路径 query:{ res:res } }); }...

2020-09-23 16:20:23 644

原创 v-for循环按钮，单选按钮变色

<template> <div class="container"> <div class="circle" v-for="(word,index) in words" v-bind:key="word.id">  <button class="btn" :class="{ red:changeRed == index}" @click="checked(index)"&gt

2020-09-09 15:57:17 1122 1

原创 watch监听选项内容（搭配dropdown组件）（下拉框）

组件引用div里<van-dropdown-menu active-color="red"> <van-dropdown-item v-model="value" :options="option" /></van-dropdown-menu>script里<script>export default { data() { return { value: '', option: [

2020-08-12 18:09:12 723

原创 select option 基础使用

div里 <select> <option v-for="item in option" :key="item.value" :label="item.label" :value="item.value" > </option> </select>script里return里 option:[{

2020-08-11 17:14:31 701

转载 vscode学习vue（一）

这里写自定义目录标题文件名.vue里的内容：template、div、script以及style分别应该写什么内容<template> <div class='hi' @click="showMessage('tom')"> {{message}} <div v-if="age < 18"> 你未成年 </div> <div v-else-if="age < 21"> 你成年了 </div>

2020-08-11 14:51:09 220

原创 vue写时间选择器

index.jsimport Datetime from 'vue-datetime'// You need a specific loader for CSS filesimport 'vue-datetime/dist/vue-datetime.css'Vue.use(Datetime)新建一个Datatime.jsimport { Datetime } from 'vue-datetime';Vue.extend({ template: '...', components:

2020-08-07 09:38:34 505

原创圆形头像叠加样式-本地图片

div部分<div class="avatar-list-stacked"> <span class="avatar" ><van-image :src="require('../../assets/图层 1.png')" round width="30px" height="30px"/></span> <span class="avatar" ><van-

2020-07-27 23:12:29 750

原创菜单栏在当前页面加载另一页内容用法之router-link和router-view

.vue//填写需要跳转的页面<div> <router-link to="/home">跳转链接</router-link></div>//展示跳转页面的地方 <div class="content"> <router-view></router-view></div>index.js{ path: '/page',

2020-07-27 21:46:57 532

原创获取当前时间

<template><div> {{gettime}} </div></template><script>export default { created(){ //触发定时器，创建当前时间 this.currentTime(); }, methods: { //获取当前时间，进行转换 getTime:function(){ var _this

2020-07-22 09:11:33 196

原创更改头像-获取本地图片

调用了ajax，所以需要提前安装ajax<template> <div class="adatar"> <img :src="adatar?adatar:require('../../assets/微信.png')" alt="" > <input type="file" name="" accept="image/gif,image/jpeg,image/jpg,image/png" @change="fileChange

2020-07-21 18:12:29 239

转载点击按钮显示div内容，再点击按钮显示另一个div内容，用JS怎么写

只能显示，不能隐藏<button @click='onclick'></button><div><mycomponent v-if='showcom'></mycomponent></div>{data: {showcom: false}methods: {onclick: function () {this.showcom = true;}}}

2020-07-19 21:48:27 1619

Havanao的博客