Question

我的旧车把视图中有以下复选框：

<div class="form-group">
    <input type='checkbox' name='xmlOnline[]' value="stepstone" class='' {{#if (ifIn 'stepstone' job.xmlOnline)}} checked="checked" {{/if}}> Stepstone
    <input type='checkbox' name='xmlOnline[]' value="karriere" class='' {{#if (ifIn 'karriere' job.xmlOnline)}} checked="checked" {{/if}}> Karriere
</div>

因此，如果job.xmlOnline将“stepstone”作为值，则应将其标记为已选中。同样适用于“karriere”。

现在我正在尝试在Vue.js中为我的POST表单实现相同的功能。这就是对象“作业”的样子：http://t2w-api.herokuapp.com/jobs/590c20d42b1c4300046bb1b9

所以它可以包含“karriere”，“stepstone”，两者或“null”。

到目前为止我在我的组件中得到了什么：

<div v-for="(xml, index) in job.xmlOnline">
    <input type="checkbox" :checked="xml == 'stepstone'"> Stepstone {{ index }}
    <input type="checkbox" :checked="xml == 'karriere'"> Karriere {{ index }}
</div>

检查复选框，但我重复了它们。我也不知道如何添加v模型。

这是我的组件的来源。做了类似“资格”/“责任”的事情：https://github.com/markusdanek/t2w-vue/blob/mdanek/2-auth-system/src/components/backend/JobEdit.vue

Answer 1

可能的解决方案

<input type="checkbox" 
       :checked="job.xmlOnline && job.xmlOnline.includes('stepstone')"
       @change="onChange('stepstone', $event)"> Stepstone
<input type="checkbox" 
       :checked="job.xmlOnline && job.xmlOnline.includes('karriere')"
       @change="onChange('karriere', $event)"> Karriere

和onChange方法

methods:{
  onChange(value, $event){
    if (!this.job.xmlOnline)
      this.job.xmlOnline = []

    const index = this.job.xmlOnline.findIndex(v => v == value) 
    const checked = $event.target.checked

    if (checked && index < 0)
      this.job.xmlOnline.push(value)
    if (!checked && index >= 0)
      this.job.xmlOnline.splice(index, 1)
  }
}

Example

Answer 2

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using Autodesk.Revit.DB;
using Autodesk.Revit.UI;
using Autodesk.Revit.Attributes;
using Autodesk.Revit.DB.Structure;
using Microsoft.Office.Interop.Excel;
using Line = Autodesk.Revit.DB.Line;
using System.IO;

namespace RevitComm
{
    [TransactionAttribute(TransactionMode.Manual)]
    class Boundaries : IExternalCommand
    {
        public Result Execute(ExternalCommandData commandData, ref string message, ElementSet elements)
        {


            //-------------------------------------------------Reading from excel  coordinates-------------------------------------------------------------|

            Microsoft.Office.Interop.Excel.Application xlApp = new Microsoft.Office.Interop.Excel.Application();
            Microsoft.Office.Interop.Excel.Workbook xlWorkbook = xlApp.Workbooks.Open(@"D:\Example.xlsx");
            Microsoft.Office.Interop.Excel.Worksheet xlWorksheet = xlWorkbook.Sheets[1];
            Microsoft.Office.Interop.Excel.Range xlRange = xlWorksheet.UsedRange;

            //---------------------------------------------------Rows and columns--------------------------------------------------------------------------|
            int rowCount = xlRange.Rows.Count;
            int colCount = xlRange.Columns.Count;

            //--------------------------------------------------Conversion Factor--------------------------------------------------------------------------|                                                 
            double cF = 1 / 0.3048;

            //-------------------------------------- No of entered rows + 1 as rows starts from 2 -------------------------------------------------------|                                         
            int rows = Convert.ToInt32(xlRange.Cells[3, "B"].value2) + 3;


            //---------------------------------------------------Getting Active Revit Document--------------------------------------------------------------|
            UIDocument uidoc = commandData.Application.ActiveUIDocument;
            Document doc = uidoc.Document;


            double z = 0;


            //------------------------------------------- Getting the level on which Wall starts------------------------------------------------------------|
            Level level = new FilteredElementCollector(doc)
                .OfCategory(BuiltInCategory.OST_Levels)
                .WhereElementIsNotElementType()
                .Cast<Level>()
                .First(x => x.Name == "Level 1");

            //------------------------------------------------- Getting level on which Roof to be placed ----------------------------------------------------|
            Level upperlevel = new FilteredElementCollector(doc)
                .OfCategory(BuiltInCategory.OST_Levels)
                .WhereElementIsNotElementType()
                .Cast<Level>()
                .First(x => x.Name == "Level 2");


            //-------------------------------------------------  Roof type  ---------------------------------------------------------------------------------|
            var rooftype = new FilteredElementCollector(doc).OfCategory(BuiltInCategory.OST_Roofs)
          .WhereElementIsElementType().Cast<RoofType>().First(x => x.Name == "Generic - 9\"");




            //------------- Floor type example __________//
            var floorty = new FilteredElementCollector(doc).OfCategory(BuiltInCategory.OST_Floors)
         .WhereElementIsElementType().Cast<FloorType>().First(x => x.Name == "OurFloor");




            //----- wall type example

            var wallty = new FilteredElementCollector(doc).OfCategory(BuiltInCategory.OST_Walls)
         .WhereElementIsElementType().Cast<WallType>().First(x => x.Name == "JustGeneric");



            //------------------------------------------ List for Points -----------------------------------------------------------------------------|
            List<XYZ> pointStr = new List<XYZ>();


            //----------Start Points------/          
            for (int i = 4; i < rows; i = i + 2)

            {
                XYZ pi = new XYZ(xlRange.Cells[i, "N"].value2 * cF, xlRange.Cells[i, "O"].value2 * cF, z);
                pointStr.Add(pi);

            }


            //----------------End Points ------------/
            List<XYZ> pointEnd = new List<XYZ>();
            for (int i = 5; i <= rows; i = i + 2)

            {
                XYZ pi = new XYZ(xlRange.Cells[i, "N"].value2 * cF, xlRange.Cells[i, "O"].value2 * cF, z);
                pointEnd.Add(pi);

            }




            //-----------------------------------------------------------List for Lines -------------------------------------------------------|


            List<Line> lines = new List<Line>();
            for (int i = 0; i < (rows - 3) / 2; i++)
            {
                XYZ pk = pointStr.ElementAt(i);
                XYZ pj = pointEnd.ElementAt(i);
                Line l = Line.CreateBound(pk, pj);
                lines.Add(l);
            }

            //------------------------------------------------------- List for Curves for walls ------------------------------------------------------|

            List<Curve> curWalls = new List<Curve>();

            for (int i = 0; i < (rows - 3) / 2; i++)
            {
                Line li = lines.ElementAt(i);
                curWalls.Add(li);
            }

            List<Curve> Curvet = curWalls.GetRange(0,4);

            CurveLoop crvloopExE = CurveLoop.Create(Curvet);

            CurveLoop offcrExE = CurveLoop.CreateViaOffset(crvloopExE, 0.5 * cF, new XYZ(0, 0, 1));

            CurveArray curArrExE = new CurveArray();

            foreach (Curve c in offcrExE)
            {
                /// To put the curves to Currve array
                curArrExE.Append(c);

            }




            // ------------------------------------ Start transaction -------------------------------------------------------|
            try
            {

                //return Result.Succeeded;

                using (Transaction trans = new Transaction(doc, "Neus-Haus"))

                {

                    trans.Start();

                    // Creating Walls



                    for (int i = 0; i <= 5; i++)

                        Wall W1 = Wall.Create(doc, curWalls.ElementAt(i), wallty.Id, level.Id, 3 * cF, 0, false, false);
                    }




                   trans.Commit();
                }
                return Result.Succeeded;
            }

            catch (Exception e)

            {
                message = e.Message;
                return Result.Failed;
            }


        }
    }
}

和组件方法

<input type="checkbox" class="form-check-input" :value="party.status" 
@change="updateStatus"
 :checked="party.status == 1 ? true: false"
 id="status" name="status"/>

Answer 3

您可以将其绑定为文字

:true-value="1"

，它将按预期工作。

Answer 4

<b-form-checkbox class="col-sm-1 small" :value="1" switch v-model="user.nameb" :state="Boolean(user.nameb)" name="checkbox-validation">
    <b-form-invalid-feedback v-show="!Boolean(user.nameb)" :state="Boolean(user.nameb)">Not Verified</b-form-invalid-feedback>
    <b-form-valid-feedback v-show="Boolean(user.nameb)" :state="Boolean(user.nameb)">Verified</b-form-valid-feedback>
</b-form-checkbox>

Vue.js：设置复选框，检查语句是否为真

4 个答案: