vue vjsf通过json配置生成表单示例代码

代码语言:html

所属分类:表单美化

代码描述:vjsf通过vuetify结合materialdesignicons,使用json配置来生成一个漂亮表单示例代码

代码标签: vue vuetify json 配置 表单

下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开

<!DOCTYPE html>

<html lang="en">

<head>

   
<meta charset="UTF-8">




   
<link rel='stylesheet' href='https://fonts.googleapis.com/css?family=Roboto:100,300,400,500,700,900'>
   
<link type="text/css" rel="stylesheet" href="//repo.bfw.wiki/bfwrepo/css/materialdesignicons.4.0.css">
   
<link type="text/css" rel="stylesheet" href="//repo.bfw.wiki/bfwrepo/css/vuetify.min.css">
   
<link type="text/css" rel="stylesheet" href="//repo.bfw.wiki/bfwrepo/css/vjsf.main.css">





</head>

<body>
   
<v-app id="app">
       
<v-container>
           
<p>valid={{valid}}</p>
           
<v-form ref="form" v-model="valid">
               
<v-jsf v-model="model" :schema="schema" :options="options">
                   
<template slot="rating" slot-scope="{ value, on }" class="field">
 
<star-rating :value="value" @rating-selected="on.input" :show-rating="false" />
</template>
                   
<template slot="stringProp1-prepend">
    this is a Vuetify code slot
 
</template>
                    <template sl.........完整代码请登录后点击上方下载按钮下载查看

网友评论0