liuzhenhe1988的专栏

在使用淘宝镜像安装cnpm时报错npm error request to https://registry.npm.taobao.org/cnpm failed, reason: certificate has expired，解决方案 如下。

在vue中使用v-for绑定数据时，经常会动态刷新数据，有时候会遇到刷新后没有动态自动更新绑定的展示数据，也就是说在函数中改变了页面中的某个值，在函数中查看是修改成功了，但在页面中没有及时刷新改变后的值，这时候可以用this.$forceUpdate() 进行强制刷新；......

前言在使用element ui的el-input 输入框时，无法输入内容，后来发现是因为没有给input绑定值（v-model）原因Input 为受控组件，它总会显示 Vue 绑定值。（所以必须要给input绑定值v-model）通常情况下，应当处理input事件，并更新组件的绑定值（或使用v-model）。否则，输入框内显示的值将不会改变。不支持v-model修饰符。参考代码<el-input v-model="input" placeholder="...

前言在使用element ui table时，每一行有一个删除按钮，想要的效果是当点击删除按钮时，先弹出删除确认框，用户点击确认后才进行删除操作，但是在测试过程中发现了如下两个问题：1、删除按钮不显示（element-ui table中使用Popconfirm或者Popover弹窗时）2、按钮显示后，点击按钮无法弹出提示框解决方案1、删除按钮不显示问题描述：在element-ui table中使用Popconfirm或者Popover时，Popconfirm或Popover中的.

前言近期在项目中遇到一个比较常见的需求，需要把富文本内容展示在vue页面中，当时的想法是用一个第三方富文本编辑器进行展示，后来发现是否可以通过一个div把内容展示出来，经过测试可以通过v-html=变量或方法对div直接赋值示例parentContent为变量 data() { return { form: this.$store.state.newsitem, parentContent: this.$store.state.newsitem.con.

前言在业务场景中经常会遇到子组件向父组件传递数值，或是父组件向子组件传递数值，下面将结合vue富文本框一起来了解一下父与子组件之间的传值业务场景在vue项目中创建了一个可以重复使用的富文本编辑器（可参考【vue】vue富文本编辑器（可重复使用组件）vue-quill-editor），由于是新闻编辑页面，首先需要把已经保存好的新闻内容展示在富文本编辑器中（父组件向子组件传值），其次需要把更新后的新闻内容保存到数据库中（子组件向父组件传值）父组件向子组件传值 (v-bind:child.

前言在vue项目中经常会遇到需要编辑和展示一些比较复杂的新闻内容，这时候就会用到富文本编辑器，接下来咱们一起来看一下如何在vue中使用富文本组件vue-quill-editor1、安装editor组件在终端运行命令cnpm install vue-quill-editorcnpm install vue-quill-editor安装成功后结果如下2、引用vue-quill-editor在main.js中写入如下代码//引用vue-quill-editor组件和样式

报错信息在vue父组件传递数据给子组件时候，通过双向绑定给属性赋值时候，报错如下：Avoid mutating a prop directly since the value will be overwritten whenever the parent component re-renders. Instead, use a data or computed property based on the prop's value. Prop being mutated: "content"报错.

前言在之前我们已经搭建了vue开发环境、创建了第一个vue项目、使用了element ui前端UI框架，接下来将走进实际业务场景，创建一个新闻管理页面（component），并且通过axios请求web api，并把返回的数据绑定到新闻管理页面element ui table中进行展示，咱们一起开始吧axios安装和使用1、什么是axiosaxios 是一个基于Promise 用于浏览器和 nodejs 的 HTTP 客户端，主要是用于向后台发起请求（如：webapi）2、安装axi

前言vue中通过axios调用webapi获取数据后，把数据绑定到element table时候，报错：

前言在之前的篇章中咱们一起搭建了vue开发环境，接下来开始创建第一个vue+element项目吧（vue：前端JavaScript框架 element：前端UI框架）vue开发环境搭建请参考【vue】在windows中搭建vue开发环境（全网最详细）创建vue项目一、开发工具vs code1、创建一个存放项目的文件目录，如：C:\Project\VUE2、在文件目录空白处，右键点击“通过code打开”（推荐使用vs code 开发）3、通过以下截图打开终端，如下图

前言目前前端三大框架（vue、react、angular）中vue是前端工程师经常使用的，在使用之前需要搭建vue开发环境，闲话少说，接下来咱们一起操作起来吧环境系统：Windows运行时：node.js搭建步骤一、安装nodejs1、下载并安装node.js在浏览器中打开nodejs官网https://nodejs.org/zh-cn/，选择需要的版本直接点击即可下载下载后双击，在弹出的对话框中，点击“运行”然后就是一系列的“下一步”..

文章目录前言 一、pandas是什么？ 二、使用步骤 1.引入库 2.读入数据 总结前言市面上前端UI框架可以说是很多很多，今天想和大家一起聊一聊如何在vue项目中适用antd UI框架（因为之前在react项目中一直是用的antd UI框架，感觉整体风格挺不错）一、使用步骤1.安装antdcnpm install ant-design-vue --save//注意：需要安装ant-design-vue（区别于在react项目中的安装命令 antd...

前言刚刚创建好的vue项目， 在执行npm run serve后，是可以正常看到页面内容的，但是执行npm run build之后，从文件夹dist中直接打开index.html,却什么也看不到，一片空白，找其原因是因为资源文件的路径都找不到了，下面将通过配置文件解决此问题解决方案1、在根目录下创建配置文件vue.config.js2、在配置文件中写如下代码module.exports = { publicPath: './'}3、在目录dist中打开index.

前言在前两期咱们通过两种方式创建了vue项目，今天和大家一起来看一下vue目录结构以及vue项目的框架原理vue目录结构1、node_modules目录用于存放项目的依赖库2、public目录存放的是一些公用文件，比如初始创建项目后public目录中有两个文件，一个是图标，一个是通用的index页面（错误页面）3、src目录就是工作中经常用到的目录，其中assets目录存放的是一些静态资源（如：css、image）4、components目录用于存放通用的组件，.

上一篇主要讲了通过命令行的方式创建vue项目（vue create test_vue_app）,今天咱们通过另外一种方式（浏览器可视化）来创建一个vue项目1、通过vs code（或是power shall）打开放置项目的文件夹，如test004，然后输入vue ui2、稍等片刻后，会自动打开浏览器，以可视化的（UI）形式来创建vue项目点击create a new project here, 在新页面中，输入project folder，test_vue_app02packa..

安装vue脚手架并检查环境1、通过vs code打开项目文件夹，如test0042、在终端安装vue脚手架npm install --global vue-cli3、检查node、npm、vue版本号在终端分别输入node -v、npm -v、 vue -V(注意vue -V为大写V)结果执行vue -V时候报错，如下vue : File C:\Users\my-lzh\AppData\Roaming\npm\vue.ps1 cannot be loaded. The fi

通过终端命令创建vue项目（第一种创建vue项目的方式）1、在终端输入 vue create test_vue_app，执行后需要选择一个预设功能，首次创建时候选择Manually select features（手动选择功能）说明：vue_test是之前我创建项目时候保存的一个预设2、通过键盘上的上下键选择manually select features后，按回车键后会出现下图然后根据需要上下键切换，按空格键选择选择完成后按enter键，选择vue版本，如3.X接着