Comments (2)
最近一段时间比较忙没怎么关注 3.0 的进展,script-setup 变化还挺大的,我回头再更新一下文档~
关于这 2 个 API,用法是这样:
useAttrs
可以直接拿到非 props
的数据
<script setup lang="ts">
import { useAttrs } from 'vue'
const attrs = useAttrs()
// 打印所有的attrs
console.log(attrs);
// 只打印某个attr
console.log(attrs.msg);
</script>
如果没有指定为 props,那么父组件传进来的属性都会挂到 attrs 这边来,就可以通过这个方法拿到了
useSlots
目前推测应该是提供给 JSX / TSX 用的,用法比如:
父组件如果是像这样传入了插槽数据
<template>
<ChildTSX>
<p>I am a default slot from TSX.</p>
<template #msg>
<p>I am a msg slot from TSX.</p>
</template>
</ChildTSX>
</template>
<script setup lang="ts">
import ChildTSX from '@cp/context/Child.tsx'
</script>
那么在 JSX / TSX 的子组件,通过 useSlots
来获取父组件传进来的 slots
import { defineComponent, useSlots } from 'vue'
const ChildTSX = defineComponent({
setup() {
const slots = useSlots()
return () => (
<div>
<p>{ slots.default ? slots.default() : '' }</p>
<p>{ slots.msg ? slots.msg() : '' }</p>
</div>
);
},
});
export default ChildTSX;
from learning-vue3.
果然是实验性的 API ,还没正式启用就弃用了……我去瞅瞅新的变化~
from learning-vue3.
Related Issues (20)
- 插件使用章节cnpm的registry域名更新 HOT 1
- 有没有考虑加入Pinia学习教程? HOT 3
- Comments on the pinia page HOT 3
- 谢谢作者 HOT 2
- Comments on the guide page HOT 49
- 作者你好, HOT 1
- 要不要讲一讲 pug 和 ref 糖? HOT 6
- Good tutorial~ HOT 1
- 大佬快来 HOT 2
- feat: 建议更新官方文档链接说明 HOT 2
- Comments on the typescript page HOT 25
- Comments on the engineering page HOT 10
- Comments on the plugin page HOT 1
- 这里是而??的DOM ? HOT 1
- vue3+vite谷歌可以调试吗? HOT 2
- typescript 相应写成了响应 HOT 1
- 大佬 您个人网站是用node写的后端吗 HOT 3
- vue.chengpeiquan.com无法访问 HOT 1
- 请问 https://vue3.chengpeiquan.com 这个网站是用那个UI框架做的? HOT 1
- How to contribute articles to this repo? HOT 1
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from learning-vue3.