vue2自定义组件v-model
摘要:####vue2自定义组件v-model #####一、自定义组件 <template> <input type="text" :value="value" @input="$emit('update:value', $event.target.value)"> </template> <scrip
阅读全文
vue-elementui树组件添加连接线
摘要:<template> <el-tree :data="data" default-expand-all :props="defaultProps" @node-click="handleNodeClick" /> </template> <script> export default { name:
阅读全文
vue+elementui动态表单
摘要:<template> <el-form ref="ruleformRef" :model="ruleform"> <el-form-item v-for="(li, i) in ruleform.array" :key="i" :label="`姓名${i}`" :prop="`array.${i}
阅读全文
render函数绑定属性和事件
摘要:目录render函数绑定属性和事件 render函数绑定属性和事件 import HelloWorld from './components/HelloWorld.vue' export default { name: 'App', render(h) { return h('div', { //
阅读全文
vue+swiper使用
摘要:####vue+swiper使用 #####一、安装 npm i -S swiper@5 vue-awesome-swiper #####二、main.js import VueAwesomeSwiper from 'vue-awesome-swiper' // swiper版本5 import '
阅读全文
vue-高德根据IP获取定位和根据定位获取天气
摘要:import request from '@/utils/request' import settings from '@/settings' // 高德 export default { // 根据ip获取定位 getPosition(ip, key = settings.amapServiceK
阅读全文
vue-关于引入和scope域
摘要:1、vue每执行到一个组件就会在head标签下添加对应组件的script和style标签。 2、在js或vue文件中文件以import 'xx/xx/xx.js'方式引入,该引入的文件会按顺序执行。 3、在js或vue文件中文件以import obj from 'xx/xx/xx.js'方式引入,该
阅读全文
vue-iconfont字体图标
摘要:<template> <div> <i style="font-family: '天气';" v-for="(li,i) in icons" :key="i" v-html="`&#x${li.unicode};`"></i> </div> </template> <script> export d
阅读全文
vue项目锚点动画滚动
摘要:<template> <div> <h2 ref="目录">目录</h2> <ul style="list-style-image:radial-gradient(transparent, green, transparent);"> <li @click="$refs.第一章.scrollInto
阅读全文
vue全屏组件
摘要:<template> <div ref="full" class="ll-full"> <div ref="adapter" class="ll-adapter"> <slot /> <svg-icon :icon-class="useicon" class-name="ll-icon" @clic
阅读全文
移动端适配方案pxtorem
摘要:####一、移动端适配方案pxtorem #####1、安装 # vue create hello-world创建的项目 npm i -D autoprefixer@8.0.0 npm i -D postcss-pxtorem npm i -S lib-flexible #####2、新建postc
阅读全文
vue+富文本插件
摘要:<template> <div style="line-height: normal"> <vue-ueditor-wrap v-model="msg.html" :config="myConfig" /> </div> </template> <script> import VueUeditorW
阅读全文
移动端页面开发前准备工作+vue添加动态路由+store刷新
摘要:一、移动端页面开发前准备工作 <!--禁止页面缩放--> <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable
阅读全文
vue+svg字体图标
摘要:项目结构 1、webpack.base.conf.js配置loader npm i svg-sprite-loader -D { test: /\.(png|jpe?g|gif|svg)(\?.*)?$/, loader: 'url-loader', exclude: [resolve('src/s
阅读全文
vue+webpack+sass
摘要:一、引入依赖 npm i sass sass-loader -D 二、配置webpack的loader { test: /\.sass$/, loaders: ['style', 'css', 'sass'] } 三、使用 <style lang="scss"> @import '*.scss';
阅读全文
vue+ui
摘要:一、elementui npm i element-ui -S // ******************************** import Vue from 'vue'; import ElementUI from 'element-ui'; import 'element-ui/lib/
阅读全文
vue全家桶router、vuex、axios
摘要:main.js import Vue from 'vue' import App from './App' import router from './router' import store from './vuex' import Axios from 'axios' Vue.prototype
阅读全文
vue基础
摘要:一、基本环境搭建 1、安装vue npm i @vue/cli -g npm i @vue/cli-init -g 2、创建项目 vue init webpack my-project // 版本2 // vue create hello-world // 版本3 cd my-project npm
阅读全文