Feature: Dynamic Tags render-tag prop

[OrbisK]

This function solves the problem (这个功能解决的问题)

Currently it is not possible to style tags individually.
E.g. i am using dynamic tags to add items to an array. I i want to hightlight tags which are duplicates like <n-tag type="warning" />

Expected API (期望的 API)

<n-dynamic-tags v-model:value="tags" :render-tag="renderTag"/>

const renderTag = (item)=> {
    return h(NTag, {type: item.length >=5 'warning' : 'default'}, ()=>item)
}

Or

<n-dynamic-tags v-model:value="tags" :tag-type="tagType"/>

const tagType= (item)=> {
    return item.length >=5 'warning' : 'default'
}

Or just a tag slot

[thichieuanh]

I got an issue when using custom render-tag. The validator didn't run when I clicked remove tag ('change' event was not triggered).

 <n-form :model="model" :rules="rules">
     <n-form-item path="tags" :show-label="false">
       <n-dynamic-tags v-model:value="model.tags" :render-tag="renderTag" />
     </n-form-item>
 </n-form>
 
    
 const model = ref({
        tags: ['teacher', 'programmer'],
 });
 
 
 const rules = ref({
    tags: {
       trigger: ['change'],
       validator(rule, value) {
         if (value.length >= 3) return new Error('Up to 4 tags');
         return true;
    },
  },
});

const renderTag = (tag, index) => {
  return h(
    NTag,
    {
      type: index < 3 ? 'success' : 'error',
      disabled: index > 3,
      closable: true,
      onClose: () => {
        model.value.tags.splice(index, 1);
      },
    },
    { default: () => tag },
  );
};