基于vant的移动端黑马头条知识点总结

最新推荐文章于 2024-09-03 11:09:37 发布
最新推荐文章于 2024-09-03 11:09:37 发布
阅读量1.1k 收藏 13
点赞数
分类专栏： Vue
版权声明：本文为博主原创文章，遵循 CC 4.0 BY 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_44389562/article/details/111596785
版权

移动端rem适配

Vant 中的样式默认使用 px 作为单位，如果需要使用 rem 单位，推荐使用以下两个工具：

一、使用 lib-flexible 动态设置 REM 基准值（html 标签的字体大小）

1、安装

# yarn add amfe-flexible
npm i amfe-flexible

2、然后在 main.js 中加载执行该模块

import 'amfe-flexible'

3.查看浏览器调试工具中的观察 html 标签 font-size 的变化

二、使用 postcss-pxtorem 将 px 转为 rem

1、安装

# yarn add -D postcss-pxtorem
# -D 是 --save-dev 的简写
npm install postcss-pxtorem -D

2、然后在项目根目录中创建 .postcssrc.js 文件

module.exports = {
  plugins: {
    'autoprefixer': {
      browsers: ['Android >= 4.0', 'iOS >= 8']
    },
    'postcss-pxtorem': {
      rootValue: 37.5,
      propList: ['*']
    }
  }
}

3、配置完毕，重新启动服务

4、查看浏览器调试工具审查元素的样式查看是否已将 px 转换为 rem

需要注意的是：

  • 该插件不能转换行内样式中的 px，例如 <div style="width: 200px;"></div>

Postcss文件解释

/**
 * PostCSS 配置文件
 */

module.exports = {
  // 配置要使用的 PostCSS 插件
  plugins: {
    // 配置使用 autoprefixer 插件
    // 作用：生成浏览器 CSS 样式规则前缀
    // VueCLI 内部已经配置了 autoprefixer 插件
    // 所以又配置了一次，所以产生冲突了
    // 'autoprefixer': { // autoprefixer 插件的配置
    //   // 配置要兼容到的环境信息
    //   browsers: ['Android >= 4.0', 'iOS >= 8']
    // },

    // 配置使用 postcss-pxtorem 插件
    // 作用：把 px 转为 rem
    'postcss-pxtorem': {
      // lib-flexible 的 REM 适配方案：把一行分为 10 份，每份就是十分之一
      // 所以 rootValue 应该设置为你的设计稿宽度的十分之一
      // 我们的设计稿是 750，所以应该设置为 750 / 10 = 75
      // 但是 Vant 建议设置为 37.5，为什么？因为 Vant 是基于 375 写的
      // 所以必须设置为 37.5，唯一的缺点就是使用我们设计稿的尺寸都必须 / 2
      // 有没有更好的办法？
      //   如果是 Vant 的样式，就按照 37.5 来转换
      //   如果是 我们自己 的样式，就按照 75 来转换
      // 通过查阅文档，我们发现 rootValue 支持两种类型：
      //    数字：固定的数值
      //    函数：可以动态处理返回
      //          postcss-pxtorem 处理每个 CSS 文件的时候都会来调用这个函数
      //          它会把被处理的 CSS 文件相关的信息通过参数传递给该函数
      rootValue({ file }) {
        return file.indexOf('vant') !== -1 ? 37.5 : 75;
      },

      // rootValue: 75,

      // 配置要转换的 CSS 属性
      // * 表示所有
      propList: ['*'],

      // 配置不要转换的样式资源
      exclude: 'github-markdown'
    }
  }
};

加载第三方图片资源403问题解决

这是因为我们项目的接口数据是后端通过爬虫抓取的第三方平台内容，而第三方平台对图片资源做了防盗链保护处理。

第三方平台怎么处理图片资源保护的？

服务端一般使用 Referer 请求头识别访问来源，然后处理资源访问。

解决： 1. 直接在 HTMl 页面头中通过 meta 属性全局配置

<meta name="referrer" content="no-referrer" />
  1. 用 <a>、<area>、<img>、<iframe>、<script> 或者 <link> 元素上的 referrerpolicy 属性为其设置独立的请求策略
<img src="http://……" referrerPolicy="no-referrer">

处理时间的dayjs插件

Day.js 是一个轻量的处理时间和日期的 JavaScript 库，和 Moment.js 的 API 设计保持完全一样，如果您曾经用过 Moment.js, 那么您已经知道如何使用 Day.js 。

  • Day.js 可以运行在浏览器和 Node.js 中。
  • 🕒 和 Moment.js 相同的 API 和用法
  • 💪 不可变数据 (Immutable)
  • 🔥 支持链式操作 (Chainable)
  • 🌐 国际化 I18n
  • 📦 仅 2kb 大小的微型库
  • 👫 全浏览器兼容
  1. 安装
cnpm i dayjs
  1. 使用
import dayjs from 'dayjs'
import 'dayjs/locale/zh-cn'

dayjs.locale('zh-cn')

console.log(dayjs().format('YYYY-MM-DD'))
  1. 在 main.js 中加载初始化
import './utils/dayjs'
  1. 定义处理时间的过滤器
import Vue from 'vue'
import dayjs from 'dayjs'

// 加载中文语言包
import 'dayjs/locale/zh-cn'

import relativeTime from 'dayjs/plugin/relativeTime'

// 配置使用处理相对时间的插件
dayjs.extend(relativeTime)

// 配置使用中文语言包
dayjs.locale('zh-cn')

// 全局过滤器：处理相对时间
Vue.filter('relativeTime', value => {
    return dayjs().to(dayjs(value))
})

lodash库中debounce防抖处理

_.debounce(func, [wait=0], [options=])

func:要防抖的函数

wait=0:需要延迟的毫秒数

 searchText: {
      // lodash中的debounce防抖处理
      handler: debounce(function (val) {
        this.localSearchSuggestions(val)
      }, 300),
      // handler (val) {
      //   this.localSearchSuggestions(val)
      // },
      immediate: true
    }

axios/解决后端数据大数字的问题

json-bigint

GitHub网址：https://github.com/sidorares/json-bigint

当我们在写项目的时候调用后台接口的地址需要接收一个id值例如:（id:9223372036854776000）
JavaScript 能够准确表示的整数范围在-253到253之间（不含两个端点），超过这个范围，无法精确表示这个值，这使得 JavaScript 不适合进行科学和金融方面的精确计算
浏览器会默认解析得到数值与原数值不匹配导致404问题

解决这个问题我们使用第三方插件JSON-BigInt

1. 安装

npm i json-bigint

2. 导入

var JSONbig = require('json-bigint')

3. 使用

JSONbig.parse()

将json格式字符串转化为对象与JSON.parse()类似

var json = '{ "value" : 9223372036854775807}'
// 将json字符串转为对象
console.log(JSON.parse(json))// 9223372036854776000
console.log(JSONbig.parse(json).value.toString())// 是一个对象 需要toSring() 9223372036854776000
1234
JSONbig.stringify()

将对象转化为json格式字符串与JSON.stringify()类似

// 将对象还原为json格式的字符串
console.log(JSON.stringify(JSONbig.parse(json))) // {"value":"9223372036854775807"}改变了原数据的值的数据类型
console.log(JSONbig.stringify(JSONbig.parse(json)))// {"value":9223372036854775807} 没有改变原数据
123

通过 Axios 请求得到的数据都是 Axios 处理（JSON.parse）之后的，我们应该在 Axios 执行处理之前手动使用 json-bigint 来解析处理。Axios 提供了自定义处理原始后端返回数据的 API：transformResponse 。

import axios from 'axios'
var jsonBig  = require('json-bigint')


const request = axios.create({
  baseURL: 'http://ttapi.research.itcast.cn/', // 接口基础路径

  // transformResponse 允许自定义原始的响应数据（字符串）
  transformResponse: [function (data) {
    try {
      // 如果转换成功则返回转换的数据结果
      return jsonBig.parse(data)
    } catch (err) {
      // 如果转换失败，则包装为统一数据格式并返回
      return {
        data
      }
    }
  }]
})

export default request

//“transformRequest”允许在将请求数据发送到服务器之前对其进行更改

//这只适用于请求方法“PUT”、“POST”、“PATCH”和“DELETE”

//数组中的最后一个函数必须返回字符串或Buffer的实例ArrayBuffer，

//FormData或流

//您可以修改headers对象

  // `transformRequest` allows changes to the request data before it is sent to the server
  // This is only applicable for request methods 'PUT', 'POST', 'PATCH' and 'DELETE'
  // The last function in the array must return a string or an instance of Buffer, ArrayBuffer,
  // FormData or Stream
  // You may modify the headers object
  transformRequest: [function (data, headers) {
    // Do whatever you want to transform the data

    return data;
  }],

vue-父子组件中的传值（数组，对象）

<!--父组件 -->
<template>
  <div class='container' v-for='(item,i) in list' :key='i'>{{item}}</div>
   <SonList :lists='list'></SonList>
</template>

<script>
import SonList from '组件名'
export default {
  name: '',
  data () {
    return {
        list:[1,2,3,4,5]
    }
  },
  created () {},
  methods: {},
  computed: {}
}
</script>

<style lang='less' scoped>
</style>

<!--子组件-->
<!-- 点击按钮添加数据-->
<template>
  <button @click='addData'>
      点击
    </button>
</template>

<script>
export default {
  name: '',
  props：{
	lists：{
	type:Array,
  required:true  
    }
  },
  data () {
    return {
    }
  },
  created () {},
  methods: {
      addData(){
          this.lists.push(this.lists.length++)
      }        
  },
  computed: {}
}
</script>

<style lang='less' scoped>
</style>

vue中子组件要修改父组件中的值，他不会监听到数组或对象的变化，因为在数组或对象是存储到堆中修改数据并没有改变堆中地址的变化，所以不会报错

vue-路由组件传参

  1. $route
const User = {
  template: '<div>User {{ $route.params.id }}</div>'
}
const router = new VueRouter({
  routes: [
    { path: '/user/:id', component: User }
  ]
})

在组件中使用 $route 会使之与其对应路由形成高度耦合，从而使组件只能在某些特定的 URL 上使用，限制了其灵活性。

  1. props解耦
const User = {
  props: ['id'],
  template: '<div>User {{ id }}</div>'
}
const router = new VueRouter({
  routes: [
    { path: '/user/:id', component: User, props: true },

    // 对于包含命名视图的路由，你必须分别为每个命名视图添加 `props` 选项：
    {
      path: '/user/:id',
      components: { default: User, sidebar: Sidebar },
      props: { default: true, sidebar: false }
    }
  ]
})

vue-依赖注入

在写项目的时候，多个子组件用到了父组件的一个或多个值，可以使用vue中依赖注入方便使用，不需要一级一级的传值，比如：层级比较深的情况

provide 选项允许我们指定我们想要提供给后代组件的数据/方法。

  • provide选项应该是一个对象或返回一个对象的函数。
provide: function () {
  return {
    getMap: this.getMap //要共享出去的数据
  }
}

在任何后代组件里，我们都可以使用 inject 选项来接收指定的我们想要添加在这个实例上的 property：

  • inject 选项应该是：
    • 一个字符串数组，或一个对象，对象的 key 是本地的绑定名，value 是：
      在可用的注入内容中搜索用的 key (字符串或 Symbol)，或一个对象，该对象的：
      from property 是在可用的注入内容中搜索用的 key (字符串或 Symbol)
      default property 是降级情况下使用的 value
inject: ['getMap']

注意：不要滥用

vue-自定义组件v-model与.sync修饰符

.sync修饰符

有时我们需要父组件向子组件传值，并且子组件要修改父组件中的值是，我们一般会这样写

//父组件
<template>
    //子组件修改值 父组件注册自定义事件 传过来的参数通过$event来获取
  <div :title='title' @update-title=’title=$event‘>
    {{title}}
   </div>
</template>

<script>
export default {
  data () {
    return {
        title：’父组件的值‘
    }
  }
}
</script>

<style lang='less' scoped>
</style>

//子组件
<template>
  <button @click=’$emit('update-title','子组件修改的值')‘>
		// 如果我们要修改父组件中的值 1.发送一个通知给父组件 2.父组件接到通知去修改自己的值
    //我们需要把父组件的title放到组件中使用
		{{title}}
   </button>
</template>

<script>
export default {
  props:['title']
  data () {
    return {
    }
  }
}
</script>

<style lang='less' scoped>
</style>

由于父向子传值 子组件也要修改父组件的值vue提供了一个修饰符可以更好的简化代码（.sync）

//父组件
<template>
    //子组件修改值 父组件注册自定义事件 传过来的参数通过$event来获取
  <div :title.sync='title'>
    {{title}}
   </div>
</template>

<script>
export default {
  data () {
    return {
        title：’父组件的值‘
    }
  }
}
</script>

<style lang='less' scoped>
</style>

//子组件
<template>
  <button @click=’$emit('update:title','子组件修改的值')‘>
    //我们需要把父组件的title放到组件中使用
		{{title}}
   </button>
</template>

<script>
export default {
  props:['title']
  data () {
    return {
    }
  }
}
</script>

<style lang='less' scoped>
</style>

注意带有 .sync 修饰符的 v-bind 不能和表达式一起使用 (例如 v-bind:title.sync=”doc.title + ‘!’” 是无效的)。取而代之的是，你只能提供你想要绑定的 property 名，类似 v-model

$emit('update:要传入的值')是固定写法

自定义组件的v-model

之前我们使用v-model指令用来做数据的双向绑定

由于父向子传值 子组件也要修改父组件的值vue除了.sync修饰符可以更好的简化代码，另一个就是自定义组件v-model

自定义组件v-model提供了默认的props，通过value来绑定数据源，通过监听input事件来向父组件传值

//父组件
<template>
    //子组件修改值 父组件注册自定义事件 传过来的参数通过$event来获取
  <div :value='title' @input=’title=$event‘>
    {{title}}
   </div>
</template>

<script>
export default {
  data () {
    return {
        title：’父组件的值‘
    }
  }
}
</script>

<style lang='less' scoped>
</style>

//子组件
<template>
  <button @click=’$emit('input','子组件修改的值')‘>
		// 如果我们要修改父组件中的值 1.发送一个通知给父组件 2.父组件接到通知去修改自己的值
    //我们需要把父组件的title放到组件中使用
		{{title}}
   </button>
</template>

<script>
export default {
  props:['title']
  data () {
    return {
    }
  }
}
</script>

<style lang='less' scoped>
</style>

其实value 和input是默认情况，当我们可以修改名称,通过model属性来修改

model: { prop: ‘checked’, event: ‘change’ }

//父组件
<template>
    //子组件修改值 父组件注册自定义事件 传过来的参数通过$event来获取
  <div :title='title' @update-title=’title=$event‘>
    {{title}}
   </div>
</template>

<script>
export default {
  data () {
    return {
        title：’父组件的值‘
    }
  }
}
</script>

<style lang='less' scoped>
</style>

//子组件
<template>
  <button @click=’$emit('update-title','子组件修改的值')‘>
		// 如果我们要修改父组件中的值 1.发送一个通知给父组件 2.父组件接到通知去修改自己的值
    //我们需要把父组件的title放到组件中使用
		{{title}}
   </button>
</template>

<script>
export default {
//修改名称
  model: {
    prop: 'title',
    event: 'update-title'
  },
  props:['title']
  data () {
    return {
    }
  }
}
</script>

<style lang='less' scoped>
</style>

注意

自定义组件的v-model与.sync不同的区别是

  • v-model一个组件只能绑定一次
  • .sync可以绑定多个
Wyyyy1024
关注
专栏目录
基于vant, vue, axios, vuex的移动端项目, 仿小米商场移动端项目软件源码.zip
05-05
基于vant, vue, axios, vuex的移动端项目, 仿小米商场移动端项目软件源码，较为简单的基于vant, vue, axios, vuex的移动端项目, 仿小米商场移动端项目， 有基本的页面和假数据, 适合作为电商项目的启动模板或者用作...
vue dialog 弹窗组件
weixin_45559135的博客
09-29 2257
因为官方组件不是很好用所以自己写了一个弹窗组件 ```javascript <template> <!-- <transition name='slide-fade'> --> <view class="cu-modal show dialog" v-if="isShow"> <view class="cu-dialog"> <view class="cu-bar bg-white ju
Vue.js：父组件向子组件props动态传递对象的三种方法
热门推荐
Oruizn的博客
03-20 2万+
props为我们父子组件传递简化了很多，但父组件向子组件传递的值只会在mount阶段挂载到页面一次，之后便不再执行这个阶段。那么就存在一个问题，如果我们把fatherAttrs对象修改后，子组件的attrs对象能够接收到改变，但没有办法同步更新到页面上，即上面这种方法无法使得父组件能动态地向子组件传递数据。文章为此提出了三个解决方案！
2024/9/3黑马头条跟学笔记(一)
最新发布
Zwwxd666的博客
09-03 1691
D1 视频链接 Day1-05-nacos环境搭建_哔哩哔哩_bilibili 内容介绍 搭建微服务开发环境，登录接口包含注册中心和nacos配置中心 服务端用户…微服务。网关负载均衡转发接口请求 实现微服务间互相通信 接口测试 前后端联调 前置知识 背景介绍 类似今日头条，qq看点 功能架构图 用户前台，内容浏览，登录注册。。。类似于看小说的人 用户后台，内容发布，私信管理。。。类似于小说家 超级管理员后台，对所有作者，其发布内容管理，类似于上帝 效果预览 用户群众 用户，吃瓜
vue props配置对象
MCCLS的博客
07-21 3320
先创建一个Student子组件 并且之前说过,当写重复的组件，它们的数据不是同步的,因为extend 进行了一个new Vue Component()构造函数 每次应用组件标签生成的都是一个新的组件实例对象, 而现在有个新的需求,比如上边,属性是张三 男 18 但是需要一个组件只改变它的数据值.让它显示为李四 女 20,这时貌似如果直接再定义一个组件,只把数据改了,这样也并不是复用. 可以想到,可以用动态的把数据传入,让一个组件的数据发生改变 解决办法： 1.要动态传入的...
Vue组件-父组件向子组件传值
好记性不如烂键盘
10-06 1137
父组件向子组件传值 组件中可以用props来声明需要从父级接收的数据。 props和data、method平级,有两种方式： 1. 字符串数组方式,数组中的字符串就是传递时的名称 <div id="app"> <!-- 第一步 使用bind绑定的方式 将父类的组件中的数据传给子组件 --> <parent :msg="msg"></parent> </div> <template id="temp"> <h2&
antd Collapse、Panel（最简单的折叠面板说明）
weixin_45725653的博客
03-24 3540
废话不多说！直接上代码！ import { Collapse } from 'antd'; const { Panel } = Collapse; //初始化面板的key <Collapse defaultActiveKey={['1']}> <Panel header="他是谁？" key="1">慢三步球手</Panel> <Panel header="帮助到你了吗？" key="2">是的。</Panel>
Vant移动端组件库-其他
06-11
Vant 是一套轻量、可靠的移动端组件库。通过 Vant，可以快速搭建出风格统一的页面，提升开发效率。特性：1、60+ 高质量组件2、95% 单元测试覆盖率3、完善的中英文文档和示例4、支持按需引入5、支持主题定制6、支持...
vant-shop:基于vant ui的移动端商城项目
05-14
基于vant ui的移动端商城项目 构建设置 # install dependencies npm install # serve with hot reload at localhost:8080 npm run dev # build for production with minification npm run build # build for ...
Vant 移动端元件库/微信小程序元件库
07-06
元件包含：基础组件、表单组件、反馈组件、展示组件、导航组件、业务组件、其他组件七大模块。 基础组件：颜色、字体、按钮、单元格、图标、图片、布局、弹出框、内置样式； 表单组件：日历、复选框、级联选择、...
组件通信中间人模式、bus模式及组件的属性和状态
蓝小白的博客
12-27 588
中间人模式 在vue中 , 每一个vue实例就是一个根组件,在根组件中创建的全局组件都是属于这个根组件中的子组件. 中间人模式就是两个组件通过子传父, 把数据传送给根组件, 然后根组件在把数据通过父传子传送给需要的子组件 就是 组件A和组件B通信, 组件A把数据对象data传送给根组件, 根组件接收到后, 再把数据data 传送给组件B, 根组件在这个通信过程中就叫中间人. 这种方式主要就是用来熟悉组件的父传子和子传父 bus 模式 跟中间人模式类似, 不过比较方便, 这种模式的中间人bus, 不用刻
vue组件传值 prop传递对象
qianxizq的博客
12-15 7238
vue组件传值prop
Vue——Props
hulin的博客
04-15 3707
Vue的props
url上接收到 el表达式 不渲染_VUe 中 props 这些知识点，你可能有些不懂，来复习下
weixin_39670627的博客
11-22 211
如果你一直在阅读有关"props"内容，你会发现我们可能也一直在使用它们(即使没有意识到)，但也许你并不完全确定它们是什么。或者如何正确使用它们，并充分利用它们。当你读完这篇指南时，你就会知道成为一名高效的Vue开发者所需要知道的关于props的一切。在本指南中，我们将介绍关于 props 的最重要的事情:什么是 props ?props 的两个主要特点如何将 props 传递给其他组件添加 pr...
Vue中路由props传参
weixin_42202992的博客
03-06 1537
vue-router使用props传递参数的三种方法
react组件设计原则_可靠React组件设计的7个准则之终篇
weixin_39828960的博客
12-19 165
本篇文章重点阐述可测试和富有意义。因水平有限，文中部分翻译可能不够准确，如果你有更好的想法，欢迎在评论区指出。尽管 组合、复用 和 纯组件 三个准则阅读量不高，不过本着有始有终的原则，当然我个人始终还是觉得此篇文章非常优质，还是坚持翻译完了。本篇是最后 可靠React组件设计 的最后一篇，希望对你的组件设计有所帮助。———————————————我是一条分割线————————————————如果你...
vue push 无效_VUE-这回真的要彻底理解Vue选项Props
weixin_39634351的博客
11-25 467
1.normalizeProps: initProps 之前的规范化数据normalizeProps的代码有点长，这里只列举经过规范化后的prop类型和结果1.1 字符串props: ["data"]// 规范化后props: { data:{ type: null }}1.2 对象props: { data1: { type: String, default: '' } data2: Numbe...
关于Antd中的RangePicker组件使用
ts_shinian_web
07-12 4244
在Web应用程序开发中，日期选择器是一种常见的用户界面组件，用于让用户方便地选择日期。日期选择器的设计需要考虑可用性、易用性和用户体验等因素。在众多的前端框架和库中，提供了一个功能强大、易于使用的日期选择器组件。本文将深入探讨AntD中的日期选择器，包括其定义、作用、使用场景以及如何在实际应用中使用。Ant Design的日期选择器组件提供了一种方便、简洁的方式来让用户选择日期。它支持单选、多选和范围选择等多种模式，并提供了快速导航、自定义日期格式、禁用日期等功能。
Vue2.5学习笔记（二）深入了解组件
Zijeak的博客
09-08 4235
1.组件使用的细节 1.2 子标签内使用组件 假设想在表格便签内使用一个组件作为行，直接使用组件是不行的，原因在于tbody内只能放tr便签，否则浏览器就会将tbody内的标签解析到外面，从而导致结构的错乱。 为了解决这个问题，我们可以使用is特性，将is特性设置为组件名称，这样既保证了tbody和tr之间的层级关系，也使用了组件。 1.2 非根组件的data必须是一个函数 一个组件的 data 选项必须是一个函数，因此每个实例可以维护一份被返回对象的独立的拷贝。 1.3 在Vue中操作DOM：使用ref
基于vant的移动端项目
08-03
基于vant的移动端项目是一种利用vant组件库开发的适用于移动端的应用程序。vant是一套基于Vue.js的移动端组件库，提供了丰富的UI组件和交互效果，能够帮助开发者快速构建漂亮且高效的移动端应用。 在基于vant的移动端项目中，我们可以使用vant提供的各种组件来构建页面和实现交互效果。例如，可以使用vant的按钮组件实现用户的点击操作，使用vant的表单组件实现用户输入和提交，使用vant的弹出框组件实现消息提示和确认对话框等。 此外，基于vant的移动端项目还可以利用其提供的一些特性来实现更加高级的功能。例如，vant支持移动端的适配和响应式布局，能够在不同的设备上自动调整页面的显示效果。vant还支持国际化，可以方便地适应不同语言环境下的应用需求。 基于vant的移动端项目的开发也相对简单且高效。vant提供了丰富的文档和示例代码，可以快速上手并学习如何使用各种组件和功能。vant还与Vue.js紧密结合，利用Vue.js的组件化开发思想，可以更好地管理和组织项目代码。 总之，基于vant的移动端项目能够帮助开发者快速构建漂亮且高效的移动端应用，提供了丰富的组件和特性，能够满足不同项目的需求，简化开发过程。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值