feat(ShareSheet): add className option (#6886)

* feat: van-share-sheet支持设置分享选项的类名

* Update README.zh-CN.md

* Update README.md

* Update index.vue

* fix: 添加一些van-share-sheet测试用例

* fix: change van-share-sheet test code

Co-authored-by: neverland <416417567@163.com>

src/share-sheet/README.md

@@ -130,6 +130,7 @@ export default {
 | name | Option name | _string_ |
 | description `v2.8.5` | Option description | _string_ |
 | icon | Option icon，can be set to `wechat` `weibo` `qq` `link` `qrcode` `poster` or image URL | _string_ |
+| className | Option className is used to set the class props to the share item | _string_ |
 
 ### Events
 

src/share-sheet/README.zh-CN.md

@@ -178,6 +178,7 @@ export default {
 | name | 分享渠道名称 | _string_ |
 | description `v2.8.5` | 分享选项描述 | _string_ |
 | icon | 图标，可选值为 `wechat` `weibo` `qq` `link` `qrcode` `poster`，支持传入图片 URL | _string_ |
+| className | 分享选项类名 | _string_ |
 
 ### Events
 

src/share-sheet/index.js

@@ -85,7 +85,7 @@ export default createComponent({
             <div
               role="button"
               tabindex="0"
-              class={bem('option')}
+              class={[bem('option'), option.className]}
               onClick={() => {
                 this.onSelect(option, index);
               }}

src/share-sheet/test/index.spec.js

@@ -29,6 +29,19 @@ test('description prop', () => {
   expect(wrapper.contains('.van-share-sheet__description')).toBeFalsy();
 });
 
+test('option className', () => {
+  const wrapper = mount(ShareSheet, {
+    propsData: {
+      value: true,
+      options: [{ name: 'Link', icon: 'link', className: 'foo' }],
+    },
+  });
+
+  const option = wrapper.find('.van-share-sheet__option').element;
+
+  expect(option.className.includes('foo')).toBeTruthy();
+});
+
 test('select event', () => {
   const wrapper = mount(ShareSheet, {
     propsData: {