vuex

一、vue-cli升级 1、安装 `npm install -g @vue/cli OR yarn global add @vue/cli` #升级 `yarn global upgrade --latest @vue/cli OR npm update -g @vue/cli 2、创建项目 vue create my-project OR vue ui` step1: default (babel, eslint) 默认套餐，提供 babel 和 eslint 支持。 Manually select features 自己去选择需要的功能，提供更多的特性选择。比如如果想要支持 TypeScript ，就应该选择这一项。 vue-cli 内置支持了8个功能特性，可以多选：使用方向键在特性选项之间切换，使用空格键选中当前特性，使用 a 键切换选择所有，使用 i 键翻转选项。 TypeScript 支持使用 TypeScript 书写源码。 Progressive Web App (PWA) Support PWA 支持。 Router 支持 vue-router 。 Vuex 支持 vuex 。 CSS Pre-processors 支持 CSS 预处理器。 Linter / Formatter 支持代码风格检查和格式化。 Unit Testing 支持单元测试。 E2E

这是一个vuex的项目用例；旨在分割管理项目中的 data ,以组件为单位，利用 vuex 提供的 module 属性，进行 项目 store 的加载管理；最大限度的把逻辑分离出去，让模版文件专一作模版，让 store 专心作数据管理。 src/store/index.js import Vue from 'vue' import Vuex from 'vuex' import TodoList from '../components/todoList/store'; Vue.use(Vuex) export default new Vuex.Store({ state: { }, mutations: { }, actions: { }, modules: { todoList: TodoList } }) todoList/index.vue <template> <div> <div> <input type="text" :placeholder="state.placeholder" v-model="state.inputValue"> <button type="button" @click="handleAddClick">添加</button> </div> <ul> <li v-for="(item, index) in state.list" @click=

我认为现在是写最这篇文章最好的时刻了。 写在前面 有输入，有沉淀，才有分享。 在过去的四个月中，我全身心投入到一个综合平台的前端开发上，该项目采用的是我搭建的 vue3 基础代码框架(说实话，一开始我也怕到处都是坑...)，而这个基础代码库 （仓库地址） 现在在github上已经收获了 100+ star 了，得到了一些伙伴的肯定与帮助；另外，基于此代码框架的一个中等业务量的综合平台以及后台系统都已经稳定运行在测试环境中，即将发布正式环境(可算是没白摸鱼...)；加上我自身间接性的拖延厌恶症(游戏耍腻了)，于是便想记录一下这段时间的感想，因此，我认为现在是写这篇文章最好的时刻了。 当然，我的表述中也许还有不足和错误，烦请指出。 vue3 现状 vue3 相对于vue2的好处不再介绍，更好的响应式、函数式、模版编译优化等等...但是大多数还未上手或者处于观望状态的伙伴多是有以下的疑问——vue3 现在哪个版本了？坑还多吗？周边生态支持得怎么样？TypeScript支持度以及使用丝滑度怎样？存在浏览器兼容问题吗？Options Api 和 Composition Api 又如何抉择？ 就以上问题，根据个人这段时间开发感受而言，可以简略回答为：距离vue3第一个正式版本One Piece发布将近四个月了，这中间差不多每个月有一次bug修复的小版本更新（极少的功能新增），api 已经稳定

在这一篇示例教程中，我们将会构建一个类似 Twitter 的 Web 应用。我们将使用到 Laravel 和 Vue.js，并且在 Vue.js 中定义一些组件，此外，还会使用 Axios 来发送网络请求。当然，篇幅有限，我们不可能开发一个完整的 Twitter 应用，而是实现一个简化版：用户可以发送 Tweet 并在自己的时间线中看到，可以关注或取消关注其他用户，如果关注了其他用户，那么也可以看到关注用户发布的 Tweet。麻雀虽小，五脏俱全，希望大家可以通过这个简单的应用学会 Laravel 和 Vue.js 的基础用法。 安装配置 Laravel 首先，我们需要安装一个新的 Laravel 应用（也可以通过 Composer 安装，看个人喜好）： laravel new laratwitter 进入该项目根目录，安装前端依赖： npm install 接下来，修改 .env 中数据库相关配置符合本地环境，然后通过如下命令生成用户认证脚手架代码： php artisan make :auth 运行如下命令生成相关数据表： php artisan migrate 接下来配置下 Web 服务器（使用 Valet 的话略过），我这里配置的域名是 laratwitter.test ，配置完成后重启下 Web 服务器，然后通过 http://laratwitter.test