Vuex 是一个专为 Vue.js 应用程序开发的 状态管理模式。文档地址:https://vuex.vuejs.org/zh/installation.html安装yarnyarn add vuexnpmnpm install vuex --savemain.jsimport store from './store' new Vue({ store, render: h => h(App), }).$mount('#app')新建文件 ./store/index.jsimport Vue from 'vue' import Vuex from 'vuex' // 挂载Vuex Vue.use(Vuex) // 创建VueX对象 const store = new V
https://github.com/vueComponent/ant-design-vue/blob/master/components/style/themes/default.less/* stylelint-disable at-rule-empty-line-before,at-rule-name-space-after,at-rule-no-unknown */ @import '../color/colors'; // The prefix to use on all css classes from ant. @ant-prefix: ant; // An override for the html selector for theme prefixes @html-selector: html; // -------- Colors ----------- @primary-color: @blue-6;
原文地址: https://vue-loader.vuejs.org/zh/spec.html简介.vue 文件是一个自定义的文件类型,用类 HTML 语法描述一个 Vue 组件。每个 .vue 文件包含三种类型的顶级语言块 <template>、<script> 和 <style>,还允许添加可选的自定义块:<template> <div class="example">{{ msg }}</div> </template> <script> export
1、PHP 服务器设置header('Access-Control-Allow-Origin:http://127.0.0.1:8080'); // 这里必须要对应绝对的请求地址,不可为 * header('Access-Control-Allow-Credentials:true'); //表示是否允许发送Cookie2、Vue 里 axios 配置让ajax携带cookieaxios.defaults.withCredentials = true;价值参考:《跨域资源共享 CORS 详解》—— 阮一峰http://www.ruanyifeng.com/blog/2016/04/cors.
示例<tr v-for="(item, index) of listData" :key="item.id"> <td>{{ index + 1 }}</td> </tr>效果../../md/Vue/
1、配置 webpack.dev.jsdevServer: { proxy: { '/api': { target: 'http://tdl.cc', changeOrigin: true, // pathRewrite: { '^/api': '/api' } } }, }2、安装 axios 进行 Ajax 通信yarn add axios3、安装 qs 进行 POST 序列化yarn add qs4、配置入口文件 main.js// axios import axios from 'axios' Vue.prototype.$axios = axios5、配置组件// axios import qs from 'qs' export defau
父组件通过 noticeAAA 识别调用 子组件 xxx 的方法父组件<template> <my-notice ref="noticeAAA"></my-notice> </template> <script> import myNotice from './Notice' export default { methods: { // 调用通知 DisplayNotice(){ this.$refs.noticeAAA.xxx('success') } }, } </script>子组件<script> export default { methods: {
1、创建方法新建 /Global 目录,在里面新建 index.js 文件用来存放自定义全局方法,方法名推荐使用 $ 开头以便区分。index. jsexport default { install(Vue, ) { // 验证规则 Vue.prototype.$keyRule = function (rule) { return /^[a-zA-Z0-9_-]{6,20}$/.test(rule); } }2、入口文件引入main.js// 全局方法 import Global from './Global' // 引入 Vue.use(Global)
this.$router.push()描述:跳转到不同的url,但这个方法会向history栈添加一个记录,点击后退会返回到上一个页面。// 字符串 this.$router.push('home'); // 对象 this.$router.push({ path: 'home' }); // 命名的路由,带参数 this.$router.push({ name: 'user', params: { userId: 123 }}); // 带参数,变成 /user?id=123 this.$router.push({ name: 'user', query: { userId: 123 }}
在 NPM 包的 dist/ 目录你将会找到很多不同的 Vue.js 构建版本。这里列出了它们之间的差别: UMDCommonJSES Module (基于构建工具使用)ES Module (直接用于浏览器)完整版vue.jsvue.common.jsvue.esm.jsvue.esm.browser.js只包含运行时版vue.runtime.jsvue.runtime.common.jsvue.runtime.esm.js-完整版 (生产环境)vue.min.js--vue.esm.browser.min.js只包含运行时版 (生产