vue写下拉菜单1、.then不可忘记下面的赋值

最新推荐文章于 2023-12-12 11:44:47 发布
最新推荐文章于 2023-12-12 11:44:47 发布
阅读量844 收藏
点赞数
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/Django_/article/details/103016576
版权

我们若是想要写出一个用vue的下拉菜单，那么首先需要在django视图函数去查询想要下拉菜单的内容，在这就以乐队为例，那么我就需要去django后台查询后发送给前端
在这里插入图片描述
查询完成，那么想要发送给前端就必然要经过序列化，不然会报不可序列化的错，
在这里插入图片描述
这就是我经过序列化后的数据，我为什么要在这序列化一个【切记一定不要忘了序列化id】id，name字段，是为了后面下拉框选项做准备，option标签里value需要id，字段名需要跟数据库表格里的字段名对应，接下来就可以发送给前端了
在这里插入图片描述
通过路由接口调用，然后return Response返回给前端，特别注意这里的返回数据必须是"data":data.data，不能少一个data。这样前端vue就可以接收了

vue就是用mounted方法接收：

最低0.47元/天 解锁文章
Django~溪风
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
vue fetch中的.then()的正确使用方法
10-15
在Vue.js应用中，`fetch` 是一种常用的用于获取远程数据的方法，它是现代浏览器支持的API，用于替代传统的`XMLHttpRequest`（XHR）进行异步请求。`fetch` 返回一个Promise，可以配合`.then()`方法处理响应。在本文中...
vue异步问题使用Promise解决记录
weixin_43626529的博客
10-12 729
问题描述： 提示：使用Promise来解决前端异步问题 例如： 1.我们有一个程序拥有是三个步骤分别为 {1},{2},{3} 2.在我们执行{1}中需要去获取一个数组[a],而{2}中是需要使用数组[a]的 3.由于前端代码是异步执行，所以有可能我们还没完全获取到[a]时就会执行到{2}步骤，那么这个时候{2}就会出现异常 综上所述这就是我们所说的前端异步问题，本文章介绍使用promise来解决该类问题 promise： promise是什么 例如： 1、主要用于异步计算 2、可以将异步操作队列化，按照
函数内赋值失效问题
俗人
05-20 1446
在这个前所未有的好日子，祝天下有情人今天都得加班。 我这个单身狗今天很闲（自由真舒服），就想改下之前的代码，不改还好，一改出问题了，先上代码： function qrCodeNext(url,strHeader,canDom,imgDom){ var BASE; var qrText = url,//要生成二维码的信息,文本或URL strFooter = '生成一个二维码',//底部文字描述 picWidth = 20,//图片额外宽 picHei
10.7 3解构赋值
m0_56356342的博客
10-08 220
要求属性名和变量名必须一致才可以。1. 左侧【】用于声明变量，右侧数组的单元值赋给左侧的变量。定义：将对象里面的属性和方法快速赋值给一系列变量的语法。（1）对象解构的变量名 可以重新改名。2.变量顺序依据单元值的位置依次赋值。将数组的单元值快速批量赋值给一系列变量的简介语法。1.对象解构获取属性和方法。
Vue Axios 在方法内发送请求并赋值成员变量data中的变量
Deadeyess的博客
05-04 668
【代码】Vue Axios 在方法内发送请求并赋值成员变量data中的变量。
【vue】vue给data定义的变量赋值时候报错Cannot set property ‘tableData‘ of undefined解决方案
liuzhenhe1988的专栏
10-23 4012
前言 vue中通过axios调用webapi获取数据后，把数据绑定到element table时候，报错：
一个漂亮的基于Vue写的圆环菜单组件.zip
09-24
在这个“一个漂亮的基于Vue写的圆环菜单组件.zip”中，我们看到的是一个利用Vue.js技术构建的圆环形状的菜单组件。这个开源项目提供了在Web应用中实现独特、吸引用户注意力的交互式菜单的可能性。 首先，我们要理解...
vue.js input框之间赋值方法
10-18
本文将详细讲解如何在Vue.js中实现input输入框之间的赋值方法，以及扩展讨论Vue中元素和属性的赋值策略。 首先，我们来看如何在Vue实例中实现两个input框之间的值传递。在提供的示例中，有两个主要的方法`test1`和`...
vue.js和vue.min.js
06-13
Vue.js和Vue.min.js是两种版本的同一款前端JavaScript框架——Vue.js的实现。Vue.js由尤雨溪（Evan You）开发，旨在为构建用户界面提供简洁、易用且可扩展的工具。这两个文件在功能上是相同的，但它们在实际应用中...
基于vue封装的树形菜单.zip
05-03
基于vue封装的树形菜单，已实现单选、复选、级联中选、单选前回调、单选事件、复选事件，异步加载等功能，简单好用，欢迎下载demo。 基于vue封装的树形菜单，已实现单选、复选、级联中选、单选前回调、单选事件、...
异步请求要在then里面赋值吗？
gw20192019的博客
02-01 209
)
vue 中then后的返回值
wzwzwz555的博客
10-28 1万+
Promise 中处理的是异步调用，异步调用是非阻塞式的，在调用的时候并不知道它什么时候结束，也就不会等到他返回一个有效数据之后再进行下一步处理 可以使用async和await来得到我们的返回值 在vue中的函数加上async async del(id){ var that=this var params={ ...
vue的运用
m0_51275753的博客
04-23 73
【代码】vue的运用。
Vue 接口调如何使用then()、finally()、catch()避免报错导致软件崩。
最新发布
CjiangN的博客
12-12 1328
这样写，如果接口错误，或者后端数据库断开，等等，导致返回的data没有数据，调用getData赋值时，就会出错。注意：先使用catch 提前把错误打印出，如果有返回结果，则在then方法中，再赋值出去。应该使用catch、then。
Vue简单介绍和操作指南
weixin_45581495的博客
07-16 211
Vue解决的问题是:逻辑部分和赋值部分进行分离 Vue分为: 视图部分:负责页面渲染，主要由HTML+CSS构成。 脚本部分:：负责业务数据模型（Model）以及数据的处理逻辑。 let vm = new Vue({ 选项列表; }); 选项列表 el选项：用于接收获取到页面中的元素。(根据常用选择器获取)。 data选项：用于保存当前Vue对象中的数据。在视图中声明的变量需要在此处赋值。 methods选项：用于定义方法。方法可以直接通过对象名调用，this代表当前Vue对象。 数据绑定 在视..
vue中的then方法
热门推荐
可达鸭的博客
07-10 4万+
.then((data)=>{ })里的data是指接口成功返回的数据,包含请求头,请求体,等信息; 这里的then()方法有两个参数,第一个是成功时的回调方法,默认给这个方法传递了成功的数据,另一个是失败的方法,以及失败的数据,第二个可选, <script> new Promise((resolve, reject) =>{ setTimeout(() =>{ //成功的时候调用resolve resolve('成功data')
axios基本使用
攻城狮
05-21 1万+
Get请求 后端发送的json数据，显示到浏览器上 使用Axios发送get的不带参数请求 首先引入axios <script src="https://unpkg.com/axios/dist/axios.min.js"></script> 编写JavaScript代码 <script> axios.get('/teachers/findByPage') .then(function (response) {
axios中then回调对返回数据赋值是是一个简单的浅拷贝造成的误解
imkaifan的博客
02-06 2069
原因: 此时是因为你第一次clone的时候没有输对密码，而git又记录下了这个不正确的密码。所以此时需要： 在Git上清除本地账号密码/保存账号密码 解决方案: git中执行以下命令，然后再次进行克隆即可： git config --global credential.helper wincred git credential-manager uninstall ...
vue项目.then出不来
07-11
你好，很抱歉听说你在Vue项目中遇到了.then()方法不起作用的问题。通常情况下，.then()方法用于处理Promise对象的异步操作的结果。 首先，确保你在调用.then()方法之前返回了一个Promise对象。例如，你可以使用...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值